The confusion about * {margin:0; padding:0;}

Question

In some articles that I've read, the use of * {margin:0; padding:0;} is discouraged as it would affect the web site's performance. So I turned to a reset.css stylesheet.

But I'm wondering, how does it affect the performance?

Answer 1

The reasoning behind this was discussed in this Eric Meyer post.

This is why so many people zero out their padding and margins on everything by way of the universal selector. That’s a good start, but it does unfortunately mean that all elements will have their padding and margin zeroed, including form elements like textareas and text inputs. In some browsers, these styles will be ignored. In others, there will be no apparent effect. Still others might have the look of their inputs altered. Unfortunately, there’s just no way to know, and it’s an area where things are likely to change quite a bit over the next few years.

So that’s why I don’t want to use the universal selector, but instead explicitly list out elements to be reset. In this way, I don’t have to worry about munging form elements. (I really should write about the weirdnesses inherent in form elements, but that’s for another day.)

That said, the following chart from this Steve Souders post shows the difference in load times for a test page using universal selectors compared with a page using descendant selectors.