Add Margin Between Row Elements Bootstrap

I have 3 different elements in my row class with bootstrap. I wish to create a margin (of 20px for example) between EACH of the elements in the row container. Since the elements ar

Solution 1:

I've changed the structure to a more proper one I think. And I use padding on h4 element.

See this fiddle

    <div class="row">          
        <div class="col-sm-4">
          <h4 class="margin">
            <a style="display:block" href="#">
              <span class="glyphicon glyphicon-envelope"></span>
                About Us
            </a>
          </h4>
        </div>

        <div class="col-sm-4">
          <h4 class="margin">
            <a style="display:block" href="#">
              <span class="glyphicon glyphicon-envelope"></span>
                About Us
            </a>
          </h4>
        </div>
        <div class="col-sm-4">
          <h4 class="margin">
            <a style="display:block" href="#">
              <span class="glyphicon glyphicon-envelope"></span>
                About Us
            </a>
          </h4>
        </div>
    </div>

Solution 2:

Created a fiddle to make things clear .
https://fiddle.jshell.net/q1je1kct/
Is this you wanted
Added
display:inline-block;

Update
https://fiddle.jshell.net/q1je1kct/4/

If you don't want the elements jumping to newline , take a look into this
https://fiddle.jshell.net/q1je1kct/5/
Created using flex concept.

new Update as suggested
https://fiddle.jshell.net/q1je1kct/8/