How do I get row padding in a post feed?

Question

I have a custom post loop going into a template I made - the row has to be outside of the loop, or the posts don't line up vertically. However, I need some spacing between the posts - image below to illustrate:

I have tried setting the row padding/margin in css but obvs it only applies to the row containing the loop and not anything flowing into the loop. I am not sure how I go about styling this. I am assuming I add another class around the col which I have also tried.

Answer 1

There are several possible ways that you could do, these are:

1. Adding <br /> html tag
2. Making it inside <div style="...">....</div>

Example:

<div style="padding:10px;">...</div>

You can also use <table> if you want

Answer 2

Hi Tracy you can also use Bootstrap classes for better designing:

<div class="container">
    <div class="row">
        <div class="col-sm-4">
          <h3>Column 1</h3>
          <p>Lorem ipsum dolor..</p>
          <p>Ut enim ad..</p>
        </div>
        <div class="col-sm-4">
          <h3>Column 2</h3>
          <p>Lorem ipsum dolor..</p>
          <p>Ut enim ad..</p>
        </div>
        <div class="col-sm-4">
          <h3>Column 3</h3>
          <p>Lorem ipsum dolor..</p>
          <p>Ut enim ad..</p>
        </div>
      </div>
    </div>