Adding a simple spacer to twitter bootstrap
css, ruby-on-rails-3, twitter-bootstrap
Solution
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>
Problem
I'm using twitter-bootstrap, with LESS and Rails. I want to add a simple spacer to my CSS that appears between the grid rows to space things out a bit better. I couldn't find anything in the bootstrap that does it for me so I figured I could just add a spacer div with a margin-top defined. I took the following code in my bootstrap override file: ``` .spacer { margin-top: 40px; } ``` but all the margins seem to bunch together at the top of the page and not between the grid. I'm sure its a position attribute I'm missing somewhere please help. I'm open to any other suggestions on a better way to achieve this, or if t-bootstrap has anything already that I have missed. Thanks!