Qual è l'equivalente di questo CSS twitter Bootstrap?

Question

<div style="float:left;">
    column 1
</div>
<div style="float:left;">
    column 2
</div>
<div style="clear:both;"></div>

Sono abituato alla scrittura clear:both. Ma ho sentito twitter Bootstrap c'è qualcosa chiamato "clearfix"? Su quale elemento deve / dovrei applicare "clearfix"?

Answer 1

Utilizzando i CSS è possibile utilizzare semplice il dopo 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!

tenere markup indesiderato dal vostro file html

Edit: mi dispiace! per qualche motivo il pulsante di pulsante Aggiungi commento o upvote non funziona per me stasera.

Per aggiungere la mia risposta per rispondere alla tua altra domanda:

twitter bootstrap dici utilizza una classe .clearfix, che è simile alla css ho fornito sotto, tuttavia le loro esigenze metodo da aggiungere all'elemento, cioè: "class elemento =" clearfix" o simili, dove come di css pseduo non abbiamo bisogno di aggiungere questo tocco di codice al nostro documento. Prendere nota tuttavia, non tutti i browser il supporto CSS di pseduo.

Answer 2

Probabilmente hanno solo a che fare:

<div class="container">
   <div class="row">
      <div class="span6">column 1</div>
      <div class="span6">column 2</div>
   </div>
</div>

clearfix non dovrebbe essere necessario.