Learn with an Example: How Bootstrap 5 Clearfix works?

What is Bootstrap 5 clearfix utility for?

Sometimes your content overflows the element like a div, paragraph etc. Bootstrap 5 has a built-in utility class to fix that issue.

For example, have a look at this image below with overflow content:

Using clearfix utility in Bootstrap 5

By using the Bootstrap 5 clearfix utility class, you can fix that issue easily. In the example below, we have an image and some text. The image is aligned right while the text is toward the left.

We used the same markup/CSS for both except the second one is assigned the BS 5 clearfix utility.

See online demo and code