Ordenación de columnas

También podemos modificar el orden de las columnas mediante las clases .col-*-push-* y .col-*-pull-*. Por ejemplo, con .col-md-push-3 "empujaríamos" la columna 3 espacios hacia la derecha y con .col-md-pull-3 la empujaríamos 3 espacios hacia la izquierda. A continuación podemos ver un ejemplo:

<div class="row">
  <div class="col-md-9 col-md-push-3">.col-md-9 .col-md-push-3</div>
  <div class="col-md-3 col-md-pull-9">.col-md-3 .col-md-pull-9</div>
</div>

El cual quedaría de la forma:

Column ordering

Hay que tener cuidado con estas clases si hay un cambio de fila (debido a el número de columnas ocupe más de 12), en estos casos estas clases no funcionarán correctamente.

Si queremos restaurar la posición podemos utilizar el tamaño cero (0). Por ejemplo, si habíamos desplazado la columna hacia la derecha para tamaños de pantalla pequeños y queremos que no se aplique en tamaños de pantalla medianos y grandes podríamos utilizar la clase col-md-push-0.