Adding a simple spacer to twitter bootstrap
You can add a class to each of your .row
divs to add some space in between them like so:
.spacer {
margin-top: 40px; /* define margin as you see fit */
}
You can then use it like so:
<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>
My approach. Tricky, but works well for me
<p> </p>
In Bootstrap 4 you can use classes like mt-5
, mb-5
, my-5
, mx-5
(y for both top and bottom, x for both left and right).
According to their site:
The classes are named using the format {property}{sides}-{size} for xs and {property}{sides}-{breakpoint}-{size} for sm, md, lg, and xl.
Link: https://getbootstrap.com/docs/4.0/utilities/spacing/