You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
51 lines
1.1 KiB
51 lines
1.1 KiB
9 years ago
|
.clear-fix:after
|
||
|
content: ''
|
||
|
display: table
|
||
|
clear: both
|
||
|
|
||
|
// grille ultra-simple pour projets ultra-simples
|
||
|
$grid_width : 100% // largeur de la grille en %
|
||
|
$grid_max_width : 1080px // largeur max. en px
|
||
|
$grid_cols : 12 // nombre de colonnes
|
||
|
$grid_gut : 0 // largeur de la goutière en %
|
||
|
$grid_col : ($grid_width - ($grid_gut * ($grid_cols - 1))) / $grid_cols
|
||
|
$grid_col_push : $grid_width/$grid_cols
|
||
|
$class-col : col !default
|
||
|
$class-push : push !default
|
||
|
|
||
|
// contenant
|
||
|
.wrap
|
||
|
width: $grid_width
|
||
|
max-width: $grid_max_width
|
||
|
margin: 0 auto
|
||
|
background : transparent
|
||
|
position: relative
|
||
|
z-index: 10
|
||
|
+box-sizing(border-box)
|
||
|
@extend .clear-fix
|
||
|
.col
|
||
|
float: left
|
||
|
margin: 0 $grid_gut 0 0
|
||
|
+box-sizing(border-box)
|
||
|
@extend .clear-fix
|
||
|
@for $i from 1 through $grid_cols
|
||
|
$j: $i - 1
|
||
|
.#{$class-col}-#{$i}
|
||
|
width: ($i * $grid_col) + ($j * $grid_gut)
|
||
|
.#{$class-col}-#{$i}-full
|
||
|
width: ($i * $grid_col_push)
|
||
|
float: left
|
||
|
margin: 0
|
||
|
+box-sizing(border-box)
|
||
|
@extend .clear-fix
|
||
|
.#{$class-push}-#{$i}
|
||
|
margin-left: ($i * $grid_col) + ($i * $grid_gut)
|
||
|
|
||
|
|
||
|
.col.last, .#{$class-col}-#{$grid_cols}
|
||
|
margin-right: 0
|
||
|
.col.first
|
||
|
clear : left
|
||
|
|
||
|
|