Alineación

Clases auxiliares de alineación de texto, floats y limpiado de floats.

Contenido

• Floats
• Clearfix
• Alineación de textos
• Bloque centrado
• Bloque centrado verticalmente

Floats

Las clases .float-left y .float-right permiten flotar un elemento a la izquierda o la derecha respectivamente.

<div class="float-left">Lorem ipsum</div>

<div class="float-right">Lorem ipsum</div>

Clearfix

La clase .clearfix permite "limpiar los floats" y contener a los elementos que flotan.

<div class="clearfix">
  <div class="float-left">Lorem ipsum</div>
  <div class="float-left">Lorem ipsum</div>
</div>

Alineación de textos

Clases que se ponen a un elemento contenedor para alinear a la izquierda (.align-left), alinear a la derecha (.align-right) y centrar (.align-center).

<div class="align-left">Lorem ipsum…</div>
<div class="align-right">Lorem ipsum…</div>
<div class="align-center">Lorem ipsum…</div>

Bloque centrado

La clase .center-block permite centrar un bloque.

<div class="center-block">Lorem ipsum…</div>

Bloque centrado verticalmente

La clase .vertical-center permite centrar un bloque verticalmente, empleando flexbox.

<div class="vertical-center xx-vertical-center">
  <div>Lorem ipsum…</div>
</div>