views:

206

answers:

3

At the moment I am just resetting the styles I need at the top of my style-sheet, like:

html, body, div, fieldset, form, h1, h2, h3, h4, p, ul, li {
    margin: 0;
    padding: 0;
}

However, I have seen a lot of times that people use:

* {
    margin: 0;
    padding: 0;
}

That does seem to make things easier, but somewhere else (don´t remember where...) I read that using the * selector seriously affects performance.

Is that true, does a long list of selectors (the example just has a few selectors, it could be more) perform significantly better than the * selector and are there perhaps other disadvantages to the * selector?

+4  A: 

Why not use one of the standard CSS reset files such as Eric Meyer's or YAHOO's?

Vinay Sajip
I'm not voting you down, but you did not answer the question at all. Both Yahoo and Eric Meyer's files explicitly list tags - just like OP does. And he's asking why?
ChssPly76
Thanks for the suggestions, but I like to use my own css so that I know exactly what is going on and to avoid unnecessary declarations.
jeroen
@Jeroen, CSS Reset's aren't "unnecessary declarations." If you're asking about balancing the behavior between various browsers, a Reset (Preferably Meyers' in my opinion) is the best way to go.
Jonathan Sampson
@ChssPly76: I agree I didn't answer the question directly, so you have a very fair point. I was just indicating what I thought was better practice - i.e. (re)using one of the standard CSS resets that some smart people have put some thought into.
Vinay Sajip
+3  A: 

Via Google's Speed Recommendations, the wildcard selector is very inefficient. Plus, in the future you might have boxes that you don't want to be reset. By naming each one individually, you get both efficiency and control.

Chacha102
The whole point of using CSS reset is to get to a common "sea level" by resetting EVERYTHING. After that you can specifically change styles for necessary items. Not that I'm arguing with not using wildcard selector.
ChssPly76
True, but this could cause unexpected behavior with future versions of HTML.
Chacha102
Thanks, that's very useful information.
jeroen
+2  A: 

I once ran some benchmarking and the *{} reset did not run any slower than the resets - Meyers, YUI and no reset at all.

The main problem with the *{} reset is that it resets the padding on the input buttons for most browsers but IE keeps some of its padding making it very hard to consistently style the buttons cross-browser.

Emily
If you set overflow: visible on input tags for IE then it will obey padding rules correctly.
Sam DeFabbia-Kane