CSS Reset: the first step to browser compatibility

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;}

2 thoughts on “CSS Reset: the first step to browser compatibility

  1. 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.

    • 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..

Leave a Reply

Your email address will not be published. Required fields are marked *

*

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>