CODEWITHSUNDEEP
cssinheritanceshorthand
Jules
Jules

Reputation: 4339

Quick couple of CSS inheritance questions

On the W3C website the border-style property (as an example) is marked as inherited 'No', yet one of the allowed values is 'inherit'. Why is this?

Does inherited 'No' mean in this case that the default value is not to inherit? If so, then I can see that anyway by looking at the default value which is 'none'.

Secondly, am I right in thinking that the 'inherit' value cannot be used for individual properties in a short-hand statement?

Upvotes: 0

Views: 80

Answers (2)

Jukka K. Korpela
Jukka K. Korpela

Reputation: 201568

The notation “Inherit: No” means that “normal” inheritance does not apply. In “normal” inheritance, if no style sheet assigns a value for a property for an element, the value of the property for the element’s parent is used. I use “normal” in quotes, since this applies to some properties only, as indicated by the “Inherit: No” notations.

The special value inherit is something quite different. When it is used, the entire value part of the declaration must consist of the word inherit only, and it simply declares that the property value is to be the same as for the element’s parent (no matter what the property is). Contrary to what the CSS 2.1 spec says, this does not force or “enforce” inheritance; the declaration participates in the cascade and it may lose to other rules (as you may guess from the example that uses the !important specifier).

Upvotes: 1

Diodeus - James MacFarlane
Diodeus - James MacFarlane

Reputation: 114367

This means if you have a DIV with a border and another DIV inside, the inside one will not take on the border properties of the parent automatically. You can force inheritance using "inherit" on the child element.

This differs from things like font-size definitions that do get inherited automatically.

Upvotes: 3

Related Questions