When I began designing websites, all of the styles were inline with the HTML. Needless to say, creating large sites was a desperate pain in the bottom. Eventually I learned how to create external sheets with CSS and Web design for the first time became a pleasure. I’ve picked up a few tricks along the way and would like to share one of the simplest, but handiest line of css code that I know.
The Asterisk!
* {
padding:0;
margin:0;
}
This asterisk simply refers to all tags. It sets all defaults to have no padding or margins. This may be a pain at first because elements such as p tags will lose their spacing, but you can simply define what you want the padding and spacing to be. This takes some of the browser variation out of the equation and simplifies the task of getting your designs to look exact in every browser.
Another addition to my simple CSS Reset Stylesheets is to set the border to none where images are inside “a” tags. Otherwise you may get a blue line around thumbnail links… Yuck!
a img {
border:none;
}
Simple, right?
Some designers use heavy CSS Reset stylesheets. Eric Meyer for instance uses a strongly developed CSS Stylesheet that resets many of the default browser styles to a stripped down starting point. The method I use is far more simple, not better in all cases, just simpler to start with. I hope this helps.
Something to consider: Using the Asterisk method is processor intensive and for that reason, I am going to shift to a similar approach to Eric Meyer. The asterisk is a simple fix, but perhaps I’ve been lazy in using this method.