Explores techniques for creating distinctive, magazine-style layouts on mobile devices without collapsing into monotonous single columns. Demonstrates practical implementations using CSS Grid, Flexbox, container queries, horizontal scrolling, shape-outside, and orientation-based layouts to design engaging content experiences that maintain visual hierarchy and storytelling on small screens. Shows how to transform desktop editorial designs into scrollable mini-spreads and orientation-responsive compositions that preserve design personality while adapting to limited space.
Table of contents
The problem with endless columnsDesigning moments instead of columnsMake use of horizontal scrollingPush elements off-canvasBuild scrollable mini-spreadsMake orientation-responsive layoutsDesign stories that adapt, not layouts that collapseSort: