Отзывчивость шаблона представления Django

Я пытаюсь работать над отзывчивостью моего django приложения на мобильном экране. Вот как оно выглядит на экране меньшего размера

Итак, я хочу удалить все белое пространство, которое я отметил синим цветом, которое должно отделять один пост от другого. Вот фрагмент кода, связанный с этим разделом

<section class="category-section">
   <div class="container" data-aos="fade-up">

     <div class="section-header d-flex justify-content-between align-items-center mb-5">
       <h2>Politics</h2>
       <div><a href="politics" class="more">See All Politics</a></div>
     </div>

     <div class="row">
       {% for politic in politics%}
       {% if forloop.counter < 11 %}
       <div class="post-entry-1 col-lg-2 col-md-6 col-xs-12 mx-1">
           <a href="/politicalpost/{{politic.id}}"><img src="{{politic.image.url}}" alt="" class="post_img img-fluid"></a>
           <div class="post-meta float-right">
               <span class="date">{{politic.category}}</span> 
               <span class="mx-1">&bullet;</span> 
               <span>{{politic.created_at}}</span>
           </div>
           <h2 class="mb-2"><a href="/politicalpost/{{politic.id}}">{{politic.title}}</a></h2>
           <span class="author mb-3 d-block">Ole Pundit</span>
           <p class="mb-4 d-block">{{politic.body| safe | truncatewords:15}}</p>
       </div>
       {% endif %}  
       {% endfor %}
     </div>
   </div>
</section>

А вот некоторые из классов стилей css, которые участвуют в игре

.post-entry-1 {
  margin-bottom: 30px;
}
.post-entry-1 img {
  margin-bottom: 30px;
}
.post-entry-1 h2 {
  margin-bottom: 20px;
  font-size: 20px;
  font-weight: 500;
  line-height: 1.2;
  font-weight: 500;
}
.post-entry-1 h2 a {
  color: var(--color-black);
}
.post-entry-1.lg h2 {
  font-size: 40px;
  line-height: 1;
}

.post-meta {
  font-size: 11px;
  letter-spacing: 0.07rem;
  text-transform: uppercase;
  font-weight: 600;
  font-family: var(--font-secondary);
  color: rgba(var(--color-black-rgb), 0.4);
  margin-bottom: 10px;
}

В чем может быть проблема?

Вернуться на верх