Chapter 7Responsive Design
All the examples we’ve seen so far in this book have one thing in common: they’re designed for computer screens and aren’t designed to look good on smaller screens, like on a smartphone or tablet. The process of making a CSS design that works on multiple-sized screens is called responsive design.
In plain CSS, responsive design can be a complicated tangle of CSS classes and @media tags. Tailwind provides modifiers that can be applied to any Tailwind utility to control the set of screen sizes.
Tailwind doesn’t take away all the complexity of responsive design; you still need to consider many factors when you’re designing for multiple sizes. For example, you need to think about which elements of your site are most important ...
Become an O’Reilly member and get unlimited access to this title plus top books and audiobooks from O’Reilly and nearly 200 top publishers, thousands of courses curated by job role, 150+ live events each month,
and much more.
Read now
Unlock full access