CSS Reset: the first step to browser compatibility
Posted in CSS | 2 Comments
As everybody knows, getting a website to look the same across different browsers is a tricky task to get right, if not impossible. That is because every browser has it’s own standard default CSS styling sheet built in. So Mozilla Firefox will have a different default style to IE7 or even IE8. Even though these differences are subtle they are enough to give you some surprising results when you view your design in a new browser or platform.
The only way to fix this is to include at the top of your own CSS style sheet a ‘CSS Reset‘ script.
A while ago i stumbled across a basic CSS reset script and after some research i discovered Eric Meyer’s CSS Rest Reloaded script. Eric has created a really comprehensive script but as ever i felt the need to edit it for my own use. I personally felt it could be stripped down slightly and sometimes went too far. Specifically the body, blockquote, q resets and setting list-style to ‘none’. The following is what i had left:
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; line-height:100%;}
:focus {
/*outline: 0; if used define new style */
}
ol, ul {list-style:circle;}
/* tables still need ‘cellspacing=”0″‘ in the markup */
table {border-collapse: separate; border-spacing: 0;}
caption, th, td {text-align: left; font-weight: normal;}
You might also like:
February 13th, 2009 at 8:56 am
Loving the cut down reset, it can get very lengthy if you dive in strait to Meyer’s solution.
Also like the wp blog. Something i have been trying out this week! still need to get my head around some bits.
February 15th, 2009 at 3:49 pm
Thanks tom, i’m planning on another post like this as i’ve cut it down some more and added bits too. Resets are a personal thing, some people like them and others don’t. I like them as i know where i stand and i’m used to using one.
Hows your WP play coming along? Do you have a test installation somewhere? I could point you in the direction of the best plugins..