O'Reilly logo

Mastering Magento Theme Design by Andrea Saccà

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

Tips and tools for responsive coding

The responsive design is the base of Bootstrap. By reading the official documentation, you will find a lot of useful tips and information to create fully responsive elements.

Now we are going to discuss the most important classes to integrate into our theme, to have the control while optimizing it for all the devices.

Hiding the unnecessary blocks for lower resolutions

With media queries, we can hide content on screens with smaller resolutions, show content on screens with a higher resolution, or vice versa. The easiest way to hide images or unnecessary blocks of content on mobile devices is by using some Bootstrap classes that would suit this purpose.

The following table taken from Bootstrap documentation shows ...

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