How to replace the * selector in production

Question

How to replace the * selector in production

Navigation

#1 by (1 votes)

1

Then, when using the * selector to reset the HTML general margin CSSLint points out that in production it can give bottleneck to the user. p>

*{ 
   margin:0;
   padding:0;
 }

For me the "solution" that comes to me is:

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;
}

But, is not it basically the same thing? I really do not know why, but in this way CSS Lint does not point to potential performance issues. Is there any function to do this? or better way? Thanks.

css css3

asked by anonymous 07.04.2017 / 13:05

1 answer

How to assign an image to a ListView Item? Recreate HTML elements from one Div to another Div by ClassName

score 1 · Accepted Answer

Universal selectors like *, [disabled] , [type=“text”] , etc. are too expensive for the browser to match, as each element in the DOM should be checked.

The universal selector is often used for box-sizing and other globals. However, this can often be optimized by grouping relevant elements. See sizing solution.

    html, body, div, article, section, main, footer, header, form, fieldset, legend,
    pre, code, p, a, h1, h2, h3, h4, h5, h6, ul, ol, li, dl, dt, dd, textarea,
    input[type="email"], input[type="number"], input[type="password"],
    input[type="tel"], input[type="text"], input[type="url"], .border-box { 
    box-sizing: border-box; 
}

See more here link