Ajout des classes pull et push pour grid

Les classes `.left` et `.right` ne sont pas applicables sur la grid.
Ajout de 2 classes pour la grid.
This commit is contained in:
Benjamin Georgeault 2015-08-07 16:42:15 +02:00
parent 17f2a3bcfc
commit 24f35a241a
5 changed files with 27 additions and 4 deletions

View File

@ -920,6 +920,12 @@ http://www.alsacreations.com/tuto/lire/1493-css3-flexbox-layout-module.html
width: calc(100% - 1em - .01px);
}
}
.pull {
margin-right: auto;
}
.push {
margin-left: auto;
}
/* ----------------------------- */
/* ==tables */
/* ----------------------------- */

File diff suppressed because one or more lines are too long

View File

@ -84,14 +84,14 @@ Il vous est très facile de "pousser" un élément à droite ou à gauche de sa
Pour cela, appliquez simplement l'une ou l'autre de ces déclarations sur l'élément :
- la classe `.right` pour le pousser à droite sur sa ligne (applique un `margin-left: auto`)
- la classe `.left` pour le pousser à gauche sur sa ligne (applique un `margin-right: auto`)
- la classe `.push` pour le pousser à droite sur sa ligne (applique un `margin-left: auto`)
- la classe `.pull` pour le pousser à gauche sur sa ligne (applique un `margin-right: auto`)
HTML :
```html
<div class="grid-4">
<div>un div ou n'importe quoi d'autre</div>
<div class="right">je suis poussé à droite</div>
<div class="push">je suis poussé à droite</div>
<div>un 3è div ou n'importe quoi d'autre</div>
<div>etc.</div>
</div>

View File

@ -170,3 +170,11 @@
.@{kna-namespace}grid-1-4 {
.uneven-grid(1,4);
}
.@{kna-namespace}pull {
margin-right: auto;
}
.@{kna-namespace}push {
margin-left: auto;
}

View File

@ -188,3 +188,12 @@
.#{$kna-namespace}grid-1-4 {
@include uneven-grid(1,4);
}
.#{$kna-namespace}pull {
margin-right: auto;
}
.#{$kna-namespace}push {
margin-left: auto;
}