--- layout: doc/layouts/default.html --- # Utility Classes

Foundation includes a handful of helpful utility classes to add certain behaviors to your elements.

***

Float Classes

You can change the float behavior of an element by adding `.left` or `.right` to an HTML element. To clear floats, add the class `.clearfix` to the parent element.

HTML

{{#markdown}} ```html ``` {{/markdown}}

Rendered HTML

***

Text Align Classes

You can change the text alignment of an element by adding `.text-left`, `.text-right`, `.text-center` or `.text-justify` to an element.

HTML

{{#markdown}} ```html

``` {{/markdown}}

Rendered HTML

This text is left aligned. Set in the year 0 F.E. ("Foundation Era"), The Psychohistorians opens on Trantor, the capital of the 12,000-year-old Galactic Empire. Though the empire appears stable and powerful, it is slowly decaying in ways that parallel the decline of the Western Roman Empire.

This text is right aligned. Set in the year 0 F.E. ("Foundation Era"), The Psychohistorians opens on Trantor, the capital of the 12,000-year-old Galactic Empire. Though the empire appears stable and powerful, it is slowly decaying in ways that parallel the decline of the Western Roman Empire.

This text is center aligned. Set in the year 0 F.E. ("Foundation Era"), The Psychohistorians opens on Trantor, the capital of the 12,000-year-old Galactic Empire. Though the empire appears stable and powerful, it is slowly decaying in ways that parallel the decline of the Western Roman Empire.

This text is justified. Set in the year 0 F.E. ("Foundation Era"), The Psychohistorians opens on Trantor, the capital of the 12,000-year-old Galactic Empire. Though the empire appears stable and powerful, it is slowly decaying in ways that parallel the decline of the Western Roman Empire.

***

Hide an Element

You can add the class `.hide` to an element to hide it. This will add the property `display: none` to the element. ```html
```