Задать вопрос
RGameShow
@RGameShow
В поисках ответов на глупые вопросы
css

Как сделать чтобы ul разбивался на колонки правильно?

Есть список, разбит на 3 колонки следующим кодом: 
ul{
    width: 100%;
    top: 63px;
    -webkit-column-count: 3;
    -moz-column-count: 3;
    column-count: 3;
    -webkit-column-rule: 1px solid lightgray;
    -moz-column-rule: 1px solid lightgray;
    column-rule: 1px solid lightgray;
}


На выходе получаю следующее:
5c9a7d89ca20f871518409.jpeg

У меня в первой колонке 9 элементов, во второй 8 и в третей 8
Как сделать так чтобы было 9 9 7?
  • Вопрос задан
  • 73 просмотра
Комментировать
Подписаться 1 Средний Комментировать
Пригласить эксперта
Ответы на вопрос 1
@t0lik
С этим разбиением на колонки лучше не связываться. Flex бери или даже CSS Grid, если IE11 и ниже поддержка не нужна. Так у тебя будет практически полный контроль над построением таких вещей.
Даже если задать высоту, марджины первого элемента первой колонки и первых элементов других колонок работают по-разному, отсюда и проблема.
5c9a8a30bccf8915986259.png
Ответ написан
1 комментарий
1 комментарий
Ваш ответ на вопрос

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

Войти через центр авторизации
Похожие вопросы
Вакансии с Хабр Карьеры
JavaScript разработчик
вАйТи
от 5 000 до 25 000 ₽
Trainee - IT Support
move2usajobs.com LLC • Лос-Анджелес
от 2 000 до 4 000 $
React разработчик
Uptrade
от 150 000 до 200 000 ₽
Ещё вакансии
Заказы с Хабр Фриланса
Написать посты на игровую тематику (PlayStation) Telegram, VK
25 апр. 2024, в 16:21
15000 руб./за проект
DevOps настройка Gitlab CICD для проекта c CF Worker
25 апр. 2024, в 16:12
2000 руб./за проект
DevOps
25 апр. 2024, в 16:08
100000 руб./за проект
Ещё заказы