A history of web layout techniques: From Frames to WebAssembly

Web layout has lurched through five distinct eras: HTML attributes like bgcolor and <font>, then <frameset cols="25%,75%">, then nested <table> scaffolding, then CSS floats wired up with clearfix hacks for the collapsing-parent problem, then Bootstrap's grid plus jQuery, and finally Flexbox and Grid — the first techniques actually designed for layout rather than borrowed from text flow or tabular data.

The full post walks each era with code examples — including a real frameset markup, a 1990s table layout, and a CSS Grid template-areas version of the same header/sidebar/main/footer page — and closes on where WebAssembly and CSS Houdini might take custom layout engines next.

Originally published at andreasbergstrom.dev — read the full post there.