Get Consistent Margins In Your CSS
Last updated: Aug 6, 2008Getting consistent margins in CSS across all browsers can be a pain. I have tried quite a few CSS clears but this one seems to work the best for me. The reason these come in handy is because IE, Firefox, and Opera all have different default margins and can cause weird formatting issues later on. This is why I usually include this on the first line of my CSS sheets. This clears out all the margin values so that I can set them later for a consistent layout across all browsers.
html, body, div, h1, h2, h3, h4, h5, h6, ul, ol, dl, li, dt, dd, p, blockquote, pre, form, fieldset, table, th, td { margin: 0; padding: 0; }
Some people just do a:
* {
margin: 0;
padding: 0;
}
But I have found that it effects more elements than necessary. After doing more research I found some articles that explain why this is way is bad in more detail. Check out this post and this one for more information.
I have found that this CSS reset has worked for me in the past. It might not be the best solution but it is what I use. What do you use?
Need to print shipping labels on your site?
Checkout my product RocketShipIt for simple easy-to-use developer tools for UPS™ FedEx™ USPS™ and more.