Question

Possible Duplicate:
Why don't CSS resets use '*' to cover all elements?

I’m doing a page that have a lightweight HTML.

I have seen gurus saying that universal selector is a bad thing and is better to use like that (From: http://meyerweb.com/eric/tools/css/reset/):

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    font: inherit;
    vertical-align: baseline;
}

Using universal selector:

* {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    font: inherit;
    vertical-align: baseline;
}

Why universal selector is a bad thing?

Considering the performance for page load I prefer the universal selector. Is there other thing that I’m not considering?

Answer 1

No control over exactly which elements are reset – every element used in the document must now have its margin and padding set explicity, plus any other properties such as border and outline that may be included in the reset .

Wave goodbye to inheritance of CSS rules from parent to child elements – the universal selector wins out every time. So not only must every element be defined after the reset, but child elements now cannot inherit each element’s properties, and so they must also be explicitly defined. The amount of code this requires may even negate the size-savings from the minimal CSS Reset!

According to the universal declaration, a browser must run through every element on the page and apply the universal rule: elements, their children and great-great-great-grandchildren all alike, and some claim that this may be a huge hit on resources and page load times (this point is debatable for modern browsers.)

Internet Explorer versions up to and including 6 exhibit the star HTML selector bug: selectors that should fail, don’t. A descendant selector, such as * html, shouldn’t match any elements, because the html element is the top-most parent element and, as such, it can’t be a descendant of any other element. However, Internet Explorer versions 5.5 and 6 ignore the universal selector at the beginning of this selector.

When the universal selector is immediately adjacent to an element type selector, Internet Explorer versions 6 and 7 will interpret the combination as a descendant selector instead of failing as they should. In Internet Explorer 6 and 7, this selector will also select some inappropriate SGML elements such as the doctype declaration and comments.