Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Andy clarke's "Universal Internet Explorer 6 CSS" vs Eric meyer "CSS Reset"

Universal Internet Explorer 6 CSS

CSS Code :

/* -------------------------------------------------------------- 
Standardised Internet Explorer 6 stylesheet:
http://forabeautifulweb.com/blog/about/universal_internet_explorer_6_css/

Based on the work of:
Mark Boulton: http://markboulton.co.uk
Eric Meyer: http://meyerweb.com
Cameron Moll: http://www.cameronmoll.com/
Richard Rutter: http://clagnut.com
Khoi Vinh: http://subtraction.com

-------------------------------------------------------------- */

html,           body, 
div,            span, 
object,         iframe, 
h1, h2, h3, h4, h5, h6, 
p,              blockquote, 
pre,            a, 
abbr,           acronym, 
address,        code, 
del,            dfn, 
em,             img, 
q,              dl, 
dt,             dd, 
ol,             ul, 
li,             fieldset, 
form,           label, 
legend,         table, 
caption,        tbody, 
tfoot,          thead, 
tr,             th, td { 
margin : 0; 
padding : 0; 
border : 0; 
font-weight : inherit; 
font-style : inherit; 
font-size : 100%; 
font-family : inherit; 
vertical-align : baseline; }

/* Body ---------------------------------------------------- */

body {
width : 60%;

/* http://www.cameronmoll.com/archives/000892.html */
width : expression(document.body.clientWidth < 640? "640px" : document.body.clientWidth > 120? "120em" : "auto");
margin : 0 auto;
padding : 2em 0;
background :  #fff;
font : 88% Georgia, Times, serif;
line-height : 1.4;
color : #333; }

/* Headings ---------------------------------------------------- */

h1, h2, h3, h4, h5, h6 { 
font-weight : normal; }

h1 { 
margin-bottom : .5em;
font-size : 3em; 
line-height : 1; }

h2 { 
margin-bottom : .75em;
font-size : 2em; }

h3 {
margin-bottom : 1em;
font-size : 1.5em;
line-height : 1 ; }

h4 {
margin-bottom : 1.25em;
font-size : 1.2em;
line-height : 1.25; }

h5, h6 { 
margin-bottom : 1.5em;
font-weight : bold; 
font-size : 1em; }

h1 img, h2 img, h3 img, h4 img, h5 img, h6 img { 
margin : 0; }

/* Text elements -------------------------------------------------------------- */

p { 
margin : 0 0 1.5em; }

a {
color : #105cb6; 
text-decoration : underline; }

a:visited { 
color : #105cb6; }

a:focus, a:hover { 
color : #003; }

a img {
border : none; }

blockquote, q {
quotes : "" ""; }

blockquote { 
margin : 1.5em 1.5em 1.5em -1.5em;
padding-left : 1.5em;
border-left : 1px solid #666;
font : italic 1.2em "Times New Roman", Times, serif; }

blockquote:before, blockquote:after, q:before, q:after { 
content : ""; }

strong { 
font-weight : bold; }

em, dfn { 
font-style : italic; }

dfn { 
font-weight : bold; }

sup, sub { 
line-height : 0; }

abbr, acronym { 
border-bottom : 1px dotted #666; }

address {
margin : 0 0 1.5em;
font-style : italic; }

del { 
color : #666; }

pre, code, tt {
margin : 1.5em 1.5em 1.5em -1.5em;
padding-left : 1.5em;
border-left : 1px dotted #666;
font : 1em 'andale mono', 'lucida console', monospace;
line-height : 1.5; }

pre { 
white-space : pre; }

code { 
display : block; }


/* Lists -------------------------------------------------------------- */

li ul, li ol { 
list-style-type : circle;
margin : 0 1.5em .75em 1.5em; }

ul, ol {
margin : 0 1.5em 1.5em 0; }

ul { 
list-style-type : disc; }

ol {
list-style-type : decimal; }

dl {
margin-bottom: 1.5em; 
padding-top: 1.5em; 
border-top : 1px solid #ccc; }

dl dt {
margin-bottom : .75em;
font-size : 1.2em;
line-height : 1.25; }

dd {
margin-bottom: 1.5em; 
padding-bottom: 1.5em; 
border-bottom : 1px solid #ccc; }

/* Tables -------------------------------------------------------------- */

table {
border-collapse : separate; 
border-spacing : 0;
margin-bottom : 1.4em;
width : 100%; }

table, td, th { 
vertical-align : top; }

th, thead th {
font-weight : bold; }

th, td, caption {
padding : 4px 10px 4px 5px; 
text-align : left; 
font-weight : normal; }

th, td {
border-bottom : 1px solid #ccc; }

tfoot { 
font-size : .9em; }

caption {
margin-bottom : 1em;
font-size : 1.5em;
line-height : 1 ; }

/* Forms -------------------------------------------------------------- */

label { 
font-weight : bold; }

fieldset { 
margin : 0 0 1.5em 0; 
padding : 1.4em 1.4em 0 1.4em; 
border : 1px solid #ccc; }

legend {  
font-size : 1.2em; 
font-weight : bold; }

textarea { 
width : 390px; 
height : 250px; 
padding : 5px; }

Eric meyer CSS reset

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    font-weight: inherit;
    font-style: inherit;
    font-size: 100%;
    font-family: inherit;
    vertical-align: baseline;
}
/* remember to define focus styles! */
:focus {
    outline: 0;
}
body {
    line-height: 1;
    color: black;
    background: white;
}
ol, ul {
    list-style: none;
}
/* tables still need 'cellspacing="0"' in the markup */
table {
    border-collapse: separate;
    border-spacing: 0;
}
caption, th, td {
    text-align: left;
    font-weight: normal;
}
blockquote:before, blockquote:after,
q:before, q:after {
    content: "";
}
blockquote, q {
    quotes: "" "";
}
  1. If I'm making a site which needs to be compatible on IE 6 also then should i use Universal IE6 CSS along with eric meyer css reset or no need or benefit to use Universal IE6 CSS ?
  2. or i should use both but Universal Internet Explorer 6 CSS only for IE6 , I mean in conditional comment.
  3. or I should use both as a normal css without conditional comment for IE6?

If i should use both then what should be order to place. Which should come first in source?

like image 718
Jitendra Vyas Avatar asked Nov 19 '25 00:11

Jitendra Vyas


1 Answers

The Universal Internet Explorer 6 CSS is not a reset CSS. It is not intended to be used with all browsers.

It is a stylesheet that gives you a text only version of a website. Its purpose is to give a usable website in IE6 without having to spend time to make it look the same as in the other browsers.

See this website: Universal Internet Explorer 6 CSS home page

and this is what that site looks like in IE6

like image 148
Emily Avatar answered Nov 20 '25 16:11

Emily



Donate For Us

If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!