Quel est l'équivalent de ce CSS sur Twitter Bootstrap?
-
26-10-2019 - |
Question
<div style="float:left;">
column 1
</div>
<div style="float:left;">
column 2
</div>
<div style="clear:both;"></div>
Je suis habitué à l'écriture clear:both
. Mais j'ai entendu sur Twitter Bootstrap il y a quelque chose appelé « clearfix »? Sur quel élément est / ce que j'apply "clearfix"?
La solution
en utilisant CSS, vous pouvez simplement utiliser le après psudeo
.class1:after, .class2:after //append as many as you like
{
clear:both;
*zoom:1;
height:0;
visibility: hidden;
display:block;
}
alternative(providing children are not using the position selector)
(parent-elemts){overflow:hidden;}//bit of a quick fix!
garder le balisage indésirable de votre fichier html
Edit: Pardon! pour une raison quelconque le bouton bouton commentaire Ajouter ou upvote ne fonctionne pas pour moi ce soir.
Pour ajouter ma réponse à répondre à votre autre question:
bootstrap twitter vous dites utilise une classe .clearfix, qui est similaire à la css I ci-dessous, mais leurs besoins de méthode à ajouter à l'élément, à savoir: « classe élément = » clearfix » ou similaire, alors que de css pseduo nous ne avez pas besoin d'ajouter ce bit de code supplémentaire à notre document. Prenez note toutefois pas
de tout le soutien des navigateurs css pseduo.Autres conseils
Vous avez probablement faire:
<div class="container">
<div class="row">
<div class="span6">column 1</div>
<div class="span6">column 2</div>
</div>
</div>
clearfix
ne devrait pas être nécessaire.