Does your white space vary too much?

The CSS universal selectorIn my last post I mentioned the importance of white space. In this respect, do your pages always look different on different browsers? Have you ever spent hours adjusting margins and padding in order to achieve an acceptable result in Internet Explorer, Firefox, Opera, Safari…?

Here is a little CSS trick that you may find worth trying. At the very top of your style sheet, enter the following rule:

*    {
  margin:  0;
  padding: 0
}

The * is the CSS ‘universal selector’. It applies to every single element on the page. So what this rule does is give every element a default margin of zero, and zero padding (on all four sides). Which means that you can then give each element, or kind of element, the exact margin and padding that you want, overriding your own zero default—and not take pot luck on browsers’ defaults.

This trick seems to have been first proposed by Andrew Krespanis, in a blog post of October 2004, Global White Space Reset. This is a post worth reading, not only for the technique, but for the many comments.

About Michael Scannell

Michael is the Web Costa Blanca webmaster. He has worked on many Web sites, both large and small, in Spain and the UK.
This entry was posted in Web design. Bookmark the permalink.

Leave a Reply