Chrome 145 introduces two new CSS properties — `column-wrap` and `column-height` — that address a long-standing limitation of multi-column layouts: horizontal overflow. With `column-wrap: wrap`, content that exceeds the column height flows into a new row below rather than creating a horizontal scroll, enabling 2D multi-column flows. The post covers practical use cases including fixed-height card grids, newspaper-style layouts, and block-direction carousels using scroll-snap. It also outlines limitations: the properties require known column heights, still need media queries for full responsiveness, and lack the precise alignment control of CSS Grid. A comparison with Grid, Flexbox, and CSS Masonry clarifies when multi-column is the right tool. Browser support is currently Chrome 145+ only.
Sort: