Как я могу создать разрыв между столбцами на макете с тремя столбцами, сохраняя при этом - PullRequest
Новая
       18

Как я могу создать разрыв между столбцами на макете с тремя столбцами, сохраняя при этом

0 голосов
/ 15 ноября 2018

Здравствуйте, сообщество и заранее спасибо за вашу помощь.У меня проблема с созданием разрыва между столбцами в моем трехколоночном макете.Я попытался использовать аргумент column-gap, но он нарушает мой макет.Я что-то упускаю? 

.row-blog {
  display: flex;
flex-wrap: wrap;
  padding: 0 4px;
 -webkit-column-gap: 10px;
  -moz-column-gap: 10px;
  column-gap: 10px;
}
.column-blog {
float: left;
    width: 33.33%;
    border: 1px solid gray;
}

.row-blog:after {
    content: "";
    display: table;
    clear: both;
}
@media screen and (max-width: 600px) {
  .row-blog {
flex-wrap: wrap;
  }
}

.column-blog img {

  vertical-align: middle;
}
<div class="row-blog">
  <div class="column-blog">
    <img src="img.jpg" alt="">
    <h2>Titre</h2>
    <p>some text</p>
  </div>
  <div class="column-blog">
    <img src="img.jpg" alt="">
    <h2>Titre</h2>
    <p>some text</p>
  </div>
  <div class="column-blog">
    <img src="img.jpg" alt="">
    <h2>Titre</h2>
    <p>some text</p>
  </div>
</div>
...