CSS Master Reset Button

CSS Hacks have become something of an expectation in web design, with the mutitude of browsers your audience may choose to view your site through its important that your website looks its best whatever the platform. The statistics for browser usage portray 72% of the market is taken by ever faithful Internet Explorer users, followed by Firefox with 19% and Safari in 3rd place with 6%

Within these browsers you then need to contend with version control, in which you may see one version behave wildly different to its predicessor, no where is this more apprent than in IE6 – IE7. With all these considerations in mind, why not make life a little easier for yourself and try using the following CSS at the top of your stylesheet.

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,
b, u, i, center,
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-size: 100%;
vertical-align: baseline;
background: transparent;
}
body {
line-height: 1;
}
ol, ul {
list-style: none;
}
blockquote, q {
quotes: none;
}

:focus {
outline: 0;
}

ins {
text-decoration: none;
}
del {
text-decoration: line-through;
}

table {
border-collapse: collapse;
border-spacing: 0;
}

What we are doing here is declaring some master styles which will overwitre any browser specific ones, take for example IE’s broken box model, this no longer becomes an issue meaning that you save yourself a lot of time, writting exemptions on id’s and classes. which means you can spend longer thinking abut how to make the site look great, and less time on how it will format in other browsers. Its as simple as that!