bogdan_uman
@bogdan_uman
шлЫмазл неукЪ-поцЪ

Как сделать отступы между колонками в адаптивном сайте?

Здравствуйте. Подскажите пожалуйста, как лучше всего сделать отступы между колонками по оси Y в адаптивном сайте, когда например колонка переходи на другую строку, та что бы все центрировалось?

5a88584165180610720096.png

задавал для
<div class="col-3 mb-3">
то тогда нижний отступ был большой
5a88598490af4225558254.png
<div class="container">
   <div class="card">
      <div class="card-header">Product list</div>
      <div class="card-body">
         <div class="row">
            <div class="col-3">
               <div class="card">
                  <div class="card-header">1 Iphone 1</div>
                  <div class="card-body"></div>
               </div>
            </div>
            <div class="col-3">
               <div class="card">
                  <div class="card-header">1 Iphone 2</div>
                  <div class="card-body"></div>
               </div>
            </div>
            <div class="col-3">
               <div class="card">
                  <div class="card-header">1 Iphone 3</div>
                  <div class="card-body"></div>
               </div>
            </div>
            <div class="col-3">
               <div class="card">
                  <div class="card-header">1 Iphone 4</div>
                  <div class="card-body"></div>
               </div>
            </div>
            <div class="col-3">
               <div class="card">
                  <div class="card-header">1 Iphone 5</div>
                  <div class="card-body"></div>
               </div>
            </div>
            <div class="col-3">
               <div class="card">
                  <div class="card-header">1 Iphone 6</div>
                  <div class="card-body"></div>
               </div>
            </div>
            <div class="col-3">
               <div class="card">
                  <div class="card-header">1 Iphone 7</div>
                  <div class="card-body"></div>
               </div>
            </div>
         </div>
      </div>
   </div>
</div>
  • Вопрос задан
  • 285 просмотров
Решения вопроса 1
Anadi
@Anadi
Если ответ Вам помог мой, решением отметье его!
Элементарно Ватсон!
<div class="card-body pt-3 pb-0">
<div class="col-3 mb-3">
Ответ написан
Комментировать
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы