There are four valid values any CSS property (see title). Of these, I would say every day that I see inherit used the most. Maybe because it’s been the longest (I think?), But also because it makes sense (“inherits your value from the next parent who sets it up”). You may see, for example, that the color of the link is ignored.

<footer>
  ©2012 Website — <a href="https://css-tricks.com/contact">Contact</a>
</footer>
/* General site styles */
a {
  color: blue;
}

footer {
  color: white;
}
footer a {
  color: inherit;
}

It’s a decent and stylish way to handle the fact that you want the text and links in a footer to be the same color without having to set it twice.

However, others behave differently …

  • initial resets the feature to the default settings.
  • unset is weird as a damn thing. Inherited property (e.g. color) it means inheritand a property that has not been inherited (e.g. float) it means initial. It’s a brain recycling for me that I’ve never used.
  • revert is similarly strange. It means the same contract for inherited properties inherit. But for inherited features, it means a return to the UA stylesheet. Kinnnnnda is useful in restoration displayfor example, does not make a <p> element display: inline; but it remains reasonable display: block;.

The PPK addressed all of this in more detail.

I’m glad he found my complaint about all of this:

Chris Coyier claim we need a new value that he calls default. It returns to the browser style sheet in all cases, even for inherited features. Therefore, it is a stronger version revert. I agree. This keyword would be really helpful.

Amen. We have four properties with a cascade of individual properties, but nothing allows us to blow everything back to the default settings of the UA stylesheet. If we had that, we would have a very powerful tool to start over in style with all the elements. In one sense: extended styles!

PPK has a Fifth Value that he finds useful: cascade. The idea (I think) it works somewhat currentColor except for any property. A kind of non-free variable that you don’t need to define gives you access to what the cascaded value would have been, except that you’re going to use it in some other context (like calculations).

LEAVE A REPLY

Please enter your comment!
Please enter your name here