Geek Answers Handbook

Repeat Selector Switches

With the recent launch of http://csslint.net , I am wondering how I built my style sheets in the past. The following method is the one I used recently:

/* Fonts */ h1 { font-size:20px } p { font-size:12px } /* Colors */ h1 { color:green } p { color:grey; background-color:white } /* Margins */ h1 { margin:0 } p { margin:0 0 5px }

The problem, according to linter, is that I declare the header selector over and over again. Of course, the reason is to maintain a logical separation between the types of rules. If I want to change colors, I would visit the region of colors. If I want to resize, I would visit dimensional areas.

Is CSSLint worried that I could be at risk of overwriting styles, thereby losing my meaning, or is there a performance issue related to how many blocks contribute to the overall presentation of the title elements?

Is it a bad practice or just a false alarm?

+4
source share
2 answers

Styles are computed for all h1 and all p in any case. The overhead of intercom matching is small compared to the "negligible" effect of the "actual" calculation and visualization of styles.

I guess you are thinking about what CSS Lint is worried about. In fact, I like the way you organize your styles yourself, and I don’t see any other problems besides overwriting ads by accident.

+1
source

From their documentation -

Header elements should have a consistent look on any site.

I think this has more to do with usability / consistency rather than performance. A heading of 20 pixels on one page and 14 pixels on another simply looks unprofessional.

0
source

More articles:


All Articles