Как решить проблема с column css?

Question

[Владислав Нагорный]

Почему 2 колонки, а нужно 3 ?

У родителя

.card-columns {
    -webkit-column-count: 3;
    column-count: 3;
    -webkit-column-gap: 1.25rem;
    column-gap: 1.25rem;
}

у элементов

.card {
    display: inline-block;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding: 26px 22px 26px 44px;
    border-radius: 2px;
    background: #fff;
    border: 1px solid #e2e2e2;
}

Но если убрать у элементов display:inline-block

Тогда будет вот такое:



В чем прикол ?

Answer 1

[Ice]

А ничего, что column-count используется для текста? Вы пытаетесь им какие-то блоки засунуть разной величины...
https://www.w3schools.com/css/tryit.asp?filename=t...