@genrich_pauls

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

Интересует ,как собрать маленькие секции в один контейнер если они идут в разнобой?
5f29659cc3f7f076412790.png
  • Вопрос задан
  • 165 просмотров
Пригласить эксперта
Ответы на вопрос 3
Stalker_RED
@Stalker_RED
Проще всего отдать на клиент без какой-то сортировки, а уже в браузере при помощи чего-то вроде masonry или isotope красиво отсортировать.

Или чего-нибудь из этого https://bashooka.com/coding/15-javascript-librarie...

А на php вы замучаетесь и все равно не получится учесть такие "мелочи" как размер экрана у юзера.
Ответ написан
@garmon85
Можно добавить классы отдельны классы большим и маленьким блокам
контейнер .gallery, большой блок .wide, маленький .tall
.gallery {
    text-align: center;
    margin-bottom: 10px;
    padding: 10px;
    display: grid;
    grid-gap: 20px;
    grid-template-columns: repeat(auto-fit, minmax(168px, 1fr));
    grid-auto-flow: dense;
}

.wide, .tall {
    background: #fff;
    box-shadow: 0 0.005em 0.01em 0 rgba(0,0,0,.1), 0 2px 5px 0 rgba(0,0,0,.1);
    position: relative;
}
.wide {
    overflow: hidden;
    grid-column: span 2;
    grid-row: span 2;
}
.tall {
    grid-row: span 1;}
Ответ написан
Ваш ответ на вопрос

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

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