Auto-height
←Good to know: The highest grid child defines the height for all siblings in a row. But in reality you will likely not see this visially right away, as when using Flexbox with gaps, an additional positionig container is invisible.
SCSS:
_flex.scss
iaculis eu non diam phasellus vestibulum lorem sed risus ultricies tristique nulla aliquet enim tortor at auctor urna nunc id cursus metus aliquam eleifend mi in nulla posuere sollicitudin aliquam ultrices sagittis orci a scelerisque purus semper eget duis at tellus at urna condimentum mattis pellentesque id nibh tortor id aliquet lectus proin nibh nisl condimentum id venenatis a condimentum vitae sapien pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas sed tempus urna et pharetra pharetra massa massa ultricies mi quis hendrerit dolor magna eget est lorem ipsum dolor sit amet consectetur adipiscing elit pellentesque habitant morbi
Si tacuisses, philosophus mansisses.
Alea iacta est.
Ave Caesar, morituri te salutant.
<div class="flex gap-no text-serif">
<div class="span-half box bg-a text-hyphen">
iaculis eu non diam phasellus vestibulum lorem sed risus ultricies tristique nulla aliquet enim tortor at auctor urna nunc id cursus metus aliquam eleifend mi in nulla posuere sollicitudin aliquam ultrices sagittis orci a scelerisque purus semper eget duis at tellus at urna condimentum mattis pellentesque id nibh tortor id aliquet lectus proin nibh nisl condimentum id venenatis a condimentum vitae sapien pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas sed tempus urna et pharetra pharetra massa massa ultricies mi quis hendrerit dolor magna eget est lorem ipsum dolor sit amet consectetur adipiscing elit pellentesque habitant morbi
</div>
<div class="span-half box bg-d text-hyphen">
Si tacuisses, philosophus mansisses.
</div>
<div class="span-half box bg-j text-hyphen">
Alea iacta est.
</div>
<div class="span-half box bg-o text-hyphen">
Ave Caesar, morituri te salutant.
</div>
</div>