csso icon indicating copy to clipboard operation
csso copied to clipboard

Remove declarations that are guaranteed overridden by specificity

Open kizu opened this issue 12 years ago • 0 comments

There could be cases when some styles would surely override some other styles even if the selectors for those styles won't match.

  • html body {…} would always override body {…}, so you could throw away the body one. body{width:10px}html body{width:20px} could be minified to just html body{width:20px}.
  • The same would go in any case where the specificity of the selector containing both html and body is higher than with the one with only body. So in case we'd have html#js body would always override body.class1.class2 etc.
  • The same would be also actual for table + tbody/tr/td in different variations, since td without table don't make sense, and tbody + tr are always created automatically.
  • There could be other similar cases, but most of them wouldn't be 100% safe (mostly because of crossbrowser issues), like using :root(), .class[class] etc.
  • The same could be used for intersecting :nth-childs — there could be cases where some of them would contain previous ones. So, :nth-child(2n) would always override :nth-child(2), :nth-child(4n) and all other that would go before it. So, :nth-child(4n){width:10px}:nth-child(2n){width:100px} could be minified to :nth-child(2n){width:100px}

kizu avatar Oct 24 '12 23:10 kizu