Bootstrap Utilities: Clearfix

The Bootstrap clearfix class allows one to quickly clear floated content. This is desirable when you want to clear the horizontal alignment of elements and force the parent container element to wrap around its children.

The term “floated content” simply refers to any elements whose float property has been set, which results in elements being aligned horizontally.

In the Bootstrap style sheet, the clearfix class is defined as follows:

.clearfix::after {

display: block;

clear: both;

content: “”;


Source: Jakobus Benjamin, Marah Jason (2018), Mastering Bootstrap 4: Master the latest version of Bootstrap 4 to build highly customized responsive web apps, Packt Publishing; 2nd Revised edition.

Leave a Reply

Your email address will not be published. Required fields are marked *