Balancing Flexbox Lines with flex-wrap: balance

With flex-wrap: wrap, the last line often holds just a few items, leaving the lines badly unbalanced. flex-wrap: balance keeps the line count that normal wrapping produces while redistributing flex items so each line comes out about the same length.

Building Responsive Shapes with the CSS shape() Function

Shapes built with clip-path's path() are hard to make responsive because its coordinates are fixed pixels. shape() defines curves with percentages, CSS units, and custom properties. This article builds a resizable speech bubble and a motion path.