Search code examples
csscss-reset

* vs html, body, div, span, applet, object, iframe...etc


Possible Duplicate:
why don't css resets use '*' to cover all elements?

Currently I use:

*{
    margin:0;
    padding:0;
}

But I am not sure why people keep using:

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, font, 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 {
    margin:0;
    padding:0;
}

Is there any particular reason why most of the sites (including this one) is using the second method?. There must be a very good reason to increasing the CSS file-size like that


Solution

  • I would actually disagree that most web developers make a long list of element selectors like that. In fact, web developers all have different views on what is the best way to reset CSS.

    For instance, the "Tripoli Reset" uses the universal selector *.

    This article details only a handful of ways to reset CSS.

    http://sixrevisions.com/css/a-comprehensive-guide-to-css-resets/

    One reason to be more specific I think is performance as the above answers mentioned (albeit modern browsers nowadays are pretty fast at parsing CSS). Furthermore, developers can also more specific if need be. For instance, some CSS properties such as border-collapse only apply to specific types of elements.