-sfzoa
Last Updated: February 25, 2016
·
1.259K
· devers
D27d0237833f17bd8c503b038c7bbcf2

Use semantic, responsive css grids!

Semantic.gs [http://semantic.gs/] is a great css grid system with support for LESS, SCSS, and Stylus

I prefer 24 columns (and SCSS), but 12 works just as well

$column-width: 30;
$gutter-width: 10;
$columns: 24;
$total-width: 100%;

header {

    @include column(24);

}

#menu {

    @include column(8);

}

#content {

    @include column(16);

}

@media only screen and (max-width:959px) {
    #content, #menu {

        @include column(24);

    }

}
Say Thanks
Respond