May 27, 2008 1:50 AM by Paul White
I was fighting some design issues on my client's new site. But I found
some CSS code that did the trick. I guess the trick is to reset all
your tags inside your CSS before starting to implement your own custom
attributes. If you have been struggling with getting your CSS to look
the same on both your firefox and IE 7 pages. This code snippet will do
the trick. The idea is that each Browser has its own default values. Unfortunately none of them are the same. This makes it very hard when trying to get your pages to look the same in different browsers.
All I did was take the following code and pasted it at the top of my CSS file.
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;
}
/* remember to define focus styles! */
:focus {
outline: 0;
}
/* remember to highlight inserts somehow! */
ins {
text-decoration: none;
}
del {
text-decoration: line-through;
}
/* tables still need 'cellspacing="0"' in the markup */
table {
border-collapse: collapse;
border-spacing: 0;
}
Thanks to Eric at meyerweb.com