O'Reilly logo

Creating concrete5 Themes by Remo Laubacher

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

Responsive techniques

Before we start adding responsive elements to our theme, let's have a look at the basic techniques we're going to work with. When building a site for a device with a small screen, we have to make sure our elements scale relative to the size of the screen.

We might also have to create a different navigation. A wide drop-down navigation would probably not work well on a cell phone.

Media queries

Media queries are an important part of responsive layouts. They are part of CSS to make it possible to add styles specific to a certain media. Media queries can target the output type, screen size, as well as the device orientation, and even the density of the display.

But let's have a look at a simple example before we get lost in theory: ...

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, interactive tutorials, and more.

Start Free Trial

No credit card required