O'Reilly logo

Sass and Compass Designer's Cookbook by Bass Jobsen

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

Creating grids with semantic.gs

HTML5 introduced many new semantic HTML tags, such as footer, header, section, among others; nevertheless, many modern CSS grid systems are built with non-semantic div tags and CSS classes. Critics even say that building your grids with div tags does not differ from the old-school table layouts. The semantic.gs mixins library provides you with a simple manner to build a 12-column semantic grid. Grids can be used as the skeleton of a responsive website.

Using grids in web design will help both the web designer and the web developer to prevent inconsistencies from occurring between the original design and the final implementation in HTML.

Getting ready

For this recipe, you have to download the latest version of the semantic.gs ...

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