Проблема с Flex

[John106]

Столкнулся с такой проблемой что при уменьшении окна браузера flex-элементы не хотят выстраиваться в один столбец. В песочнице все работает отлично, а когда делаю у себя на компьютере, то не работает. Код один и тот же пишу. На скриншотах все видно.

Код в песочнице

Скриншот 1

Скриншот 2

Проверял в Firefox все работает, а в Chrome нет... Понять не могу почему, хотя как делал примеры все работало, а когда начал сам делать не работает. (это я про то что в хроме не работает)

Edited April 1, 2017 by John106

[Igor Schnaider]

Похоже, что meta viewport нет. Но все равно, по сетке у вас выравнивания не получиться. Или вы про другое, может я вопрос неправильно понял.

[John106]

Что никто не знает как исправить эту проблему?

[Igor Schnaider]

Если я правильно понял, вам нужно, чтобы колонки тянулись, но при этом были не меньше определенной ширины и не выходили из сетки.

Средствами CSS с флэксами не получиться. (Ну только если нагородить в разметке лишних элементов в качестве заполнителей с нулевой высотой, но это не решение, конечно.)

Я бы JS использовал.

И еще, не знаю, но может на гридах такое возможно?..

[John106]

33 минуты назад, Igor Schnaider сказал:

Если я правильно понял, вам нужно, чтобы колонки тянулись, но при этом были не меньше определенной ширины и не выходили из сетки.

Средствами CSS с флэксами не получиться. (Ну только если нагородить в разметке лишних элементов в качестве заполнителей с нулевой высотой, но это не решение, конечно.)

Я бы JS использовал.

И еще, не знаю, но может на гридах такое возможно?..

Вот как работает этот код который в песочнице в браузере Firefox: Скриншот 1 Скриншот 2

А в браузере Chrome не работает: Скриншот 1 Скриншот 2, хотя когда я делал примеры по верстке Flexbox все в Chrome работало, а когда начал сам делать уже нет. Тут должно без JS работать.

Должны на мобильных экранах все эти элементы быть друг над другом, еще раз повторюсь что в Chrome в режиме адаптива не работает, а в Firefox в этом режиме работает.

[John106]

10 минут назад, Igor Schnaider сказал:

Похоже, что meta viewport нет. Но все равно, по сетке у вас выравнивания не получиться. Или вы про другое, может я вопрос неправильно понял.

Да, действительно это не работало потому что я не указал meta viewport (как-то из головы выпало). Теперь все работает как и хотел. Спасибо за отклик.