Tailwind Builder

Tailwind CSS class: .float-*

<div class="p-4">
  <img class="float-left mr-4 my-2 h-24" src="https://tailwind.build/placeholders/pictures/office.jpg">
  <p class="clearfix">Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
  <img class="float-right mr-4 my-2 h-24" src="https://tailwind.build/placeholders/pictures/office.jpg">
  <p class="clearfix">Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
  <img class="float-none mr-4 my-2 h-24" src="https://tailwind.build/placeholders/pictures/office.jpg">
  <p class="clearfix">Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
</div>

Preview

Lorem ipsum dolor sit amet, consectetur adipiscing elit.

CSS source

.float-left { float: left; }
.float-right { float: right; }
.float-none { float: none; }

Tailwind CSS class: .float-*

Preview

CSS source

More in Tailwind CSS Positioning

Tailwind CSS