Resetting styles in CSS

Published:

CSS Cascading and Inheritance Level 3 specification that has recently reached the CR (Candidate Recommendation) status contains two important new features.

  • unset value allows to reset value of a CSS property. The unset value is equivalent to inherit for inherited properties (e. g. font-size), and to initial for non-inherited ones (e. g. background).
  • Shorthand property (!) all allows to set a value to all CSS properties supported by browser without need to list them explicitly.

Using both features in conjunction as all: unset declaration should allow to easily and gracefully reach the result that is currently reached by using multiline rules inside “reset” stylesheets (e. g. reset.css).

Also, this will make it easier to embed third-party widgets to pages of websites by minimizing influence of site’s own styles to appearance of third-party widget. For such cases, initial value may be more suitable than unset since the former cancels entire inheritance chain: for example, this makes it possible for a separate block to have a font size that does not depend on font size of the HTML element.

Note that unset and initial values effectively reset display property to inline state.

Support for these features is expected in Firefox 27 planned to be released in the end of January, 2014. To try out the new features right now, nightly builds of Firefox can be used.

You may also be interested in local CSS classes.