Bonjour,
c'est un problème de flottants. L'image de la 2e colonne est la plus haute donc la 2e colonne devient la plus haute et il te faudrait habituellement un clear: left; (ou both) sur la 4e colonne ou l'un de ses conteneurs (à condition que ce conteneur ne soit pas également un conteneur des colonnes 1, 2 et 3 c'est-à-dire qu'il soit placé après.
Avec KNACSS, tu peux tout simplement ajouter une classe clearfix sur un conteneur des 3 1ères colonnes (qui ne doit pas contenir la 4e) ou (mieux, je crois), une classe .line pour contenir des flottants d'après la doc de la version actuelle :
http://www.knacss.com/demos/tutoriel.html (j'utilise une version interne à alsacreations.fr figée en juillet 2012 au début d'un projet, il y a quelques différences avec ce que j'utilise quand je suis pas en vacances. La doc a raison si j'écris autre chose
)
Si tu regardes
http://www.knacss.com/knacss.html c'est la partie :
/* blocks that must contain floats */
.clearfix:before, .clearfix:after,
.line:before, .line:after,
.mod:before, .mod:after {
content: "";
display: table;
}
.clearfix:after,
.line:after,
.mod:after {
clear: both;
}
qui t'intéresse et n'importe laquelle des 3 classes arrangerait le problème MAIS .mod a probablement d'autres effets définis ailleurs donc ne pas utiliser dans ton cas, je pense.
EDIT: clearfix, ses vies, son oeuvre dans
http://www.css-101.org/articles/clearfix/latest-new-clearfix-so-far.php et
http://www.css-101.org/articles/clearfix/latest-new-clearfix-so-far.php (1er commentaire de Florent V., admin préretraité ici même et j'apprend/réapprend des trucs en relisant l'article... cet article est du tout bon
)
Modifié par Felipe (03 Jan 2013 - 00:12)
