Название: Every Layout - Relearn CSS layout by example, 2nd Edition
Автор: Heydon Pickering, Andy Bell
Издательство: Independently published
Год: June 2021
Страниц: 262
Язык: английский
Формат: pdf, epub + Extras
Размер: 10.1 MB

If you find yourself wrestling with CSS layout, it’s likely you’re making decisions for browsers they should be making themselves. Through a series of simple, composable layouts, Every Layout will teach you how to better harness the built-in algorithms that power browsers and CSS.

Employing algorithmic layout design means doing away with @media breakpoints, “magic numbers”, and other hacks, to create context-independent layout components. Your future design systems will be more consistent, terser in code, and more malleable in the hands of your users and their devices.

What’s new?

This edition is all about the gap property, which is now supported with Flexbox in all modern browsers.

Why is gap important? Smart layout primitives like the Cluster, Sidebar, and Switcher are all designed to automatically reconfigure themselves to suit different contexts—and without needing jаvascript or @media queries.

When doing this, gutters (margins) between elements can be problematic unless handled carefully. A margin applied to one element to create a gap between it and an adjacent element becomes a misplaced margin when the element wraps.