the * selector

[cybershot]

I am taking a class at a local college for css and my instructor had this to say about the rule

* { margin: 0; padding: 0; }

Quote:

This seems like a great idea at first, but it is not universally considered the best practice. It messes up form buttons, takes longer to load, etc. Here is an article about this, for those of you who are interested. I don’t have time to research this more, but I welcome everyone’s comments and discussion here on the Bulletin Board. Also, please do not use methods like this in your assignments unless they are specifically assigned, because they may cause your file to format differently than what I am expecting for grading.

From the reference below: "The other thing is the use of the "star-selector," or * { } in CSS. The star selector selects every single element, which produces an overkill of style-nullifying. Sander pointed out that Mozilla (for one) has a great deal of default styling on form controls, which the star selector nullifies when applying margin:0 and padding:0 to it. As a result, buttons don’t behave like buttons anymore, and so forth. … most of all the weblogs I frequently comment on have this same problem: buttons not behaving like buttons. In most cases, it was indeed the star selector being the culprit."

"Additionally, Mozilla developers have stated that the star selector slows down things. While this is apparently not noticeable for end-users in most cases, it may slow down other aspects that interact with the CSS as well. And don’t forget that it’s definitely a bit overkill to loop through all elements when you only have to alter a dozen of them, roughly."

What do you guys think of this?

[falkencreative]

I’ve heard the same thing. That’s why other resets exist:

Yahoo Reset: http://developer.yahoo.com/yui/reset/
Erik Meyer’s reset: http://meyerweb.com/eric/tools/css/reset/

That perform a reset, but pick out specific elements to reset, rather than globally resetting all of them.

"Additionally, Mozilla developers have stated that the star selector slows down things. While this is apparently not noticeable for end-users in most cases, it may slow down other aspects that interact with the CSS as well. And don’t forget that it’s definitely a bit overkill to loop through all elements when you only have to alter a dozen of them, roughly."
I have heard this, and it makes sense.

"Sander pointed out that Mozilla (for one) has a great deal of default styling on form controls, which the star selector nullifies when applying margin:0 and padding:0 to it. As a result, buttons don’t behave like buttons anymore, and so forth. … most of all the weblogs I frequently comment on have this same problem: buttons not behaving like buttons. In most cases, it was indeed the star selector being the culprit."
I don’t think that this is the fault of using the star selector to remove margins and padding though… it’s simply that the web designer didn’t take the time to style the button element correctly.

[Rob MacKay]

I definitely use the * for smaller projects. I do prefer the more detailed reset from YUI though. But like Chris already said, I have never had any problems with the universal selector – and will continue to use it…

[Author]

Posts