digitalclubb
11-10-2010, 04:19 PM
Guys,
I was reading the following article on global css reset styles, but how do you know which is the best method to use?
A Killer Collection of Global CSS Reset Styles (http://perishablepress.com/press/2007/10/23/a-killer-collection-of-global-css-reset-styles/)
For example, some say using the asterisks (*) should be avoided, others say its the best method for cross browser resets.
Is it best practice to pick the resets you feel most comfortable working with and then stick to them for every project you do?
I have always used the following resets:
body {
line-height:1;
font-size:62.5%;
font-family: Avenir, Verdana, Arial, Helvetica, sans-serif;
text-align:left;
}
ul,li,ol,h1,h2,h3,h4,h5,h6,pre,form,html,p,body,blockquote,fieldset,input {
margin:0;
padding:0;
}
h1,h2,h3,h4,h5,h6,pre,code {
font-size:1em;
}
ol, ul {
list-style:none;
}
li a:active, li a:focus, a:active, a:focus {
outline:0;
border:0;
}
table {
border-collapse: collapse;
border-spacing: 0;
border-style:none;
clear:both;
}
td {
vertical-align:top;
}
form, fieldset {
border:none;
}
a {
text-decoration:none;
}
a img {
border-width:0;
border-style:none;
}
Never had an issue but not sure if this is something that can be improved or if there is a normal set of resets people tend to use?
Cheers
I was reading the following article on global css reset styles, but how do you know which is the best method to use?
A Killer Collection of Global CSS Reset Styles (http://perishablepress.com/press/2007/10/23/a-killer-collection-of-global-css-reset-styles/)
For example, some say using the asterisks (*) should be avoided, others say its the best method for cross browser resets.
Is it best practice to pick the resets you feel most comfortable working with and then stick to them for every project you do?
I have always used the following resets:
body {
line-height:1;
font-size:62.5%;
font-family: Avenir, Verdana, Arial, Helvetica, sans-serif;
text-align:left;
}
ul,li,ol,h1,h2,h3,h4,h5,h6,pre,form,html,p,body,blockquote,fieldset,input {
margin:0;
padding:0;
}
h1,h2,h3,h4,h5,h6,pre,code {
font-size:1em;
}
ol, ul {
list-style:none;
}
li a:active, li a:focus, a:active, a:focus {
outline:0;
border:0;
}
table {
border-collapse: collapse;
border-spacing: 0;
border-style:none;
clear:both;
}
td {
vertical-align:top;
}
form, fieldset {
border:none;
}
a {
text-decoration:none;
}
a img {
border-width:0;
border-style:none;
}
Never had an issue but not sure if this is something that can be improved or if there is a normal set of resets people tend to use?
Cheers