Clearfix

Per annullare il float di un contenitore.

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

<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.

<div class="bg-primary p-2 clearfix">
  <button type="button" class="btn btn-secondary float-left">Bottone con float a sinistra</button>
  <button type="button" class="btn btn-secondary float-right">Bottone con float a destra</button>
</div>