clearfix

Supple CSS | utilities.clearfix

Clears floats.

Read more about Supple CSS.

Table of contents

• Use
• Available classes
• Installation
• Testing
• Browser support

Use

<div class="u-clearfix">
  <img style="float: left;" src="//placehold.it/120x120" alt="" />
  <p>
    Lorem ipsum dolor sit amet consectetur adipisicing elit. Assumenda
    temporibus numquam repellendus repellat eaque illum, praesentium facere iure
    fugiat obcaecati? Facere, reprehenderit recusandae quae ea numquam id ut
    doloribus adipisci.
  </p>
</div>

Available classes

On the .u-clearfix block

• .u-clearfix: core visually hidden block

Installation

Make sure you've installed/downloaded the Supple CSS library: Supple CSS installation

Testing

Basic visual tests are in test.html.

Browser support

• Chromium-based browsers (Chrome, Edge, Brave, Opera)
• WebKit-based browsers (Safari, iOS Safari)
• Firefox (Gecko)