@Taron4uk

Как разделить ячейку на две части (перенести на следующую строку) используя Flexbox?

Подскажите, пожалуйста, с вопросом.
Есть таблица, которая на ПК выходит строчно, как показано на 1 скриншоте.
5dcbf394be1e8182774791.jpeg
И требуется сделать по два элемента на каждую строчку, но в одной ячейке, чтобы было так, как показано на 2 скриншоте.

*надо сделать для мобильной версии данный вариант, но не могу понять как сделать это все из таблицы
дайте хотя-бы подсказку, прошу)
Заранее, спасибо огромное!
5dcbf3cba6eae789525813.jpeg
  • Вопрос задан
  • 813 просмотров
Решения вопроса 1
sergski
@sergski
web-developer
на flex:
tr {
    display: flex;
    flex-wrap: wrap;
  
    td {
          flex-basis: 50%;
          box-sizing: border-box;
    }
}
Ответ написан
Пригласить эксперта
Ответы на вопрос 2
ns174ru
@ns174ru
https://ns174.ru
media-запросы или готовые классы bootstrap, например , помогут вам в этом)
Ответ написан
@Meakin
display:flex;
flex-wrap: wrap;
на td
box-sizing:border-box;
flex-basis:45-50%;
Ответ написан
Комментировать
Ваш ответ на вопрос

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

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