csscss-contain

Why does `container-type: size` CSS prop set height to zero?

And how to bring height back, keeping container-type: size in place? Sample: https://jsfiddle.net/yakunins/cy3b68uk/

<div style="container-type: size;">Height of this div is zero.</div>
Solution

  • Because it sets size containment. A size container cannot depend on the size of its contents, so it behaves as if its content size is 0.

    You must set an explicit height for the size container.