Here's what I ultimately ended up with:
It's a mix of the reset.css that ships with Blueprint CSS, with some other touches to make a test file (thank you Yahoo YUI project) look the same in all browsers I tested.
Code: Select all
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, code,
del, dfn, em, img, q, dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
margin: 0;
padding: 0;
border: 0;
font-weight: inherit;
font-style: inherit;
font-size: 100%;
font-family: inherit;
vertical-align: baseline;
}
body {
line-height: 1.5;
font-family: Arial,Helvetica,sans-serif,sans serif,sans;
font-size: 84%;
color: #333;
}
/* Tables still need 'cellspacing="0"' in the markup. */
table {
border-collapse: separate;
border-spacing: 0;
border-width: 0;
}
caption, th, td {
text-align: left;
font-weight: normal;
}
table, td, th {
vertical-align: middle;
}
blockquote:before, blockquote:after, q:before, q:after {
content: "";
}
blockquote, q {
quotes: "" "";
}
a img {
border: none;
}
h1,h2,h3,h4,h5,h6 {
font-weight: normal;
}
input {
vertical-align: middle;
margin-top: 2px;
}
The last 2 parts are my doing -- IE7 wasn't unbolding the h* tags like it was in the other browsers, and the INPUT trick is for FF2 and 3 so that it lines up checkboxes and radio buttons with the text, rather than the bug where the labels are lining up a few pixels downward from these controls.