Clearfix

Per annullare il float di un contenitore.

Annulla il float del contenuto aggiungendo la classe .clearfix all’elemento padre.

1
<div class="clearfix">...</div>

Esempio di visualizzazione senza l’utilizzo della classe .clearfix. In questo caso il div contenitore non si estende attorno ai pulsanti mostrando un layout incompleto.

Mentre nel seguente esempio, con l’utilizzo della classe .clearfix, viene annullato il float del contenuto permettendo una visualizzazione ottimale.

1
2
3
4
<div class="neutral-2-bg p-2 clearfix">
  <button type="button" class="btn btn-secondary float-start">Pulsante con float a sinistra</button>
  <button type="button" class="btn btn-secondary float-end">Pulsante con float a destra</button>
</div>