How does css make an element not inherit the width of the parent element, but let the child element support it?

here"s an example:
how https://jsfiddle.net/93bh7vpz/
makes the width of the inner layer and all the layers in it equal to the innermost

Css
Mar.02,2021

The width of the

html element does not have inheritance properties, and the width of the block-level element (block) occupies an entire row, so it seems to inherit, but it is not.

Let the width of an element be stretched out according to the content, as long as its display is not a block-level element, and the width is not set

for example, float,inline,position is absolute,fixed, etc. (really many, not block elements, do not set width)


display: inline-block;

Menu