In Bootstrap 3,How to change the distance between rows in vertical?

Question

I have two rows a and b,I think the distance between the two rows in vertical is too small.

I want to make the distance more bigger,I know I can change the distance in horizontal by col-md-offset-*.But how to change the vertical distance?

   <div class="row" id="a">       <img> ... </img>     <div>     <div class="row" id="b">       <button>..</button>     <div> 

Now my solution is insert a tag of h1,I think it is not graceful.

   <div class="row" id="a">       <img> ... </img>     <div>     <h1></h1>     <div class="row" id="b">       <button>..</button>     <div> 

Does it have more graceful solution?

Answer 1

Instead of adding any tag which is never a good solution. You can always use margin property with the required element.

You can add the margin on row class itself. So it will affect globally.

.row{   margin-top: 30px;   margin-bottom: 30px } 

Update: Better solution in all cases would be to introduce a new class and then use it along with .row class.

.row-m-t{   margin-top : 20px } 

Then use it wherever you want

<div class="row row-m-t"></div> 

Answer 2

use:

<div class="row form-group"></div>