Agregar un espaciador simple a twitter bootstrap

Question

Estoy usando twitter-bootstrap, con LESS and Rails.

Quiero agregar un espaciador simple a mi css que aparece entre las filas de la grilla para espaciar un poco mejor las cosas. No pude encontrar nada en el programa de arranque que lo haga por mí, así que pensé que podría agregar un separador div con un margen superior definido.

I stook el código siguiente en mi fichero alternativo de arranque:

.spacer { margin-top: 40px; } 

pero todos los márgenes parecen agruparse en la parte superior de la página y no entre la rejilla. Estoy seguro de que es un atributo de posición que me falta en algún lado, por favor ayuda.

Estoy abierto a cualquier otra sugerencia sobre mejor para lograr esto, o si t-bootstrap ya tiene algo que me he perdido.

Gracias!

Answer 1

Puede agregar una clase a cada uno de sus .row divs para añadir un poco de espacio entre ellos de esta manera:

.spacer { 
    margin-top: 40px; /* define margin as you see fit */ 
} 

A continuación, puede usarlo de esta manera:

<div class="row spacer"> 
    <div class="span4">...</div> 
    <div class="span4">...</div> 
    <div class="span4">...</div> 
</div> 

<div class="row spacer"> 
    <div class="span4">...</div> 
    <div class="span4">...</div> 
    <div class="span4">...</div> 
</div> 

Answer 2

En Bootstrap 4 (aunque sigue siendo alfa) puedes usar clases como mt-5, mb-5.

acuerdo a su sitio:

Las clases se denominan utilizando el formato {propiedad} {lados} - {tamaño} xs y {propiedad} {lados} - {punto de interrupción} - {tamaño} para sm, md, lg y xl.

Enlace: https://v4-alpha.getbootstrap.com/utilities/spacing/

Answer 3

Mi enfoque. Difícil, pero funciona bien para mí

<p>&nbsp;</p>