$columns: 12;
$mobile: “(max-width: 480px)”
@media #{$mobile} {
@for $i from 1 through $columns {
box-#{$i} {
width : 100%;
}
}
}/* On définit sa grille */
$columns : 12;
/* Gutters signifie Gouttière en anglais */
$gutters : 30px;
%box {
/* le comportement de vos boites */
float:left;
background: red;
padding: $gutters;
}
@for $i from 1 through $columns {
box-#{$i} {
@extend %box;
width : $i / $columns * 100%;
}
}