Print all posts inside a 3x3 grid

Help
1

Hello.

I’m trying to create a grid with Bootstrap 4 that contains my posts in a 3x3 grid.

My code now is:

<div class="col-sm-8" id="main-content">

  <div class="row">

    {% for post in site.posts%}
    <div class="col-sm-4">
      <div class="card" style="width: 20rem;">
        <img class="card-img-top" src="../media/logo-prueba.jpg">
        <div class="card-block">
          <h4 class="card-title">{{ post.title }}</h4>
          <p class="card-text">{{ post.category }}</p>
        </div>
      </div>
    </div>
    {% endfor %}

  </div>

</div>

The first div with col-sm-8 is just there because I’m also using a sidebar.

That code correctly prints one post inside a Bootstrap Card, but not the other ones.

Any help? Thanis in advance! :slight_smile:

2

is there a repo and public site to look at?

3

Solved it, it was basically an ‘unpublished’ post (due the time of publishing).