Chapter 8. Responsive design

This chapter covers

  • Building web pages for multiple devices and screen sizes
  • Using media queries to alter your design based on viewport size
  • Taking the “mobile first” approach
  • Responsive images

In our modern world, the web is everywhere. We use it on our desktop in our office. We lie in bed surfing on our tablet. It’s even on some of our television screens in the living room. And we carry it everywhere with us on our smartphones. The web platform of HTML, CSS, and JavaScript is a universal ecosystem unlike anything that has come before.

This poses an interesting problem for us as web developers: How do we design our site so it’s usable and appealing on any device our users might use to access it? Initially, many ...

Get CSS in Depth now with O’Reilly online learning.

O’Reilly members experience live online training, plus books, videos, and digital content from 200+ publishers.