---
id: Float
section: utilities
---import './Float.css'

## Examples

### Basic

```html
<div class="pf-u-float-left">Float left</div>
<div class="pf-u-float-right">Float right</div>
<p>Lorem, ipsum dolor sit amet consectetur adipisicing elit. Earum, odit fugit eaque ad assumenda fuga alias aut ipsum repudiandae enim pariatur ullam distinctio omnis dolorem at voluptatum saepe, beatae officiis?</p>

```

## Documentation

### Overview

[Breakpoint](/developer-resources/global-css-variables#breakpoint-variables-and-class-suffixes) is optional. Breakpoints: base (no breakpoint value), `-on-sm`, `-on-md`, `-on-lg`, and `-on-xl`. **Example .pf-u-text-left-on-lg**

### Usage

| Class                                 | Applied to | Outcome             |
| ------------------------------------- | ---------- | ------------------- |
| `.pf-u-float-left{-on-[breakpoint]}`  | `*`        | Float element left  |
| `.pf-u-float-right{-on-[breakpoint]}` | `*`        | Float element right |
