Matthias Beitl
Jan 21, 2018 · 1 min read

Thanks Noam for the inspiring idea, it gave me the opportunity to explore additional options. While turning this into pure CSS by using generated content for the SVG (similar to what Chris did), I ran into some additional quirks such as the need to add line-height:0 for certain browsers, but all in all, it works.

https://cssence.com/code/2018-01-21-maintaining-aspect-ratio-with-css-grid

    Matthias Beitl

    Written by

    CSS enthusiast (@cssence). Develops sturdy websites, .bloat{display:none;} and beyond. https://cssence.com/