Chapter 4: Responsive CSS Layout without Media Queries

Broadly speaking, the classic methodology of “responsive design” is focused around specific device breakpoints. That is, layouts are designed to adjust principally to fit nicely into the viewports of mobile, tablet and desktop devices.

A Responsive History

Technically, responsive design has been possible since the dawn of the Web, because, by default, browsers allow HTML to reflow as the viewport changes size. However, early web design tended to focus on fixed-width layouts designed for a small range of screen sizes, which became increasingly problematic as more screen sizes were developed, including those of mobile and tablet devices.

As the possibilities for CSS developed, the responsive ...

Get Unleashing the Power of CSS: Advanced Techniques for Responsive User Interfaces now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.