Becoming Responsive

Up to this point, we've built almost everything with a fixed size. Our layout had a fixed width, our images had fixed widths, and our menu had a fixed width as well. But this is not going to deliver a favorable experience when using phones, tablets, and a multitude of other device sizes that are out there. Luckily, responsive web design is here to transform our static website into a fluid, device-friendly website.

The book that started it all - Responsive Web Design, by Ethan Marcotte, 2011. He outlined three main technical pillars of responsive web design:

  • Fluid grids,
  • Flexible images, and
  • Media queries.

We'll discuss these three fundamental CSS foundations of responsive web design, followed by how to build accommodations ...

Get Mastering CSS 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.