The Height Enigma

<p>One of the most perplexing and befuddling things in CSS for me, for many years, was the behaviour of percentage-based heights. Sometimes, seemingly at random, setting <code>height: 100%</code> would have no effect at all. When I finally figured out what was going on, it was like a puzzle piece snapping into place; everything made so much more sense! In this post, I’ll share the epiphany I had, and we’ll explore some solutions.</p> <div style="margin-top: 50px; font-style: italic;"> <strong><a href="https://www.joshwcomeau.com/css/height-enigma/">Keep reading</a>.</strong> </div> <br /> <br />