Почему auto-fit и auto-fill не переносят блоки?

Question

[tyoma_koder]

Код

grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));

должен переносить грид элементы на новую строку когда они перестают влазить в блок при заданной минимальной ширине, но они этого не делают, даже при ширине экрана 320px и минимальной ширине блока 300px элементы не переносятся, отладчик почему то говорит что они шириной более 300px хотя очевидно что это не так, если открыть с телефона блоки тоже не переносятся, в чём дело?

ссылка на пример с гридами

Comments

[Yuriy Vorobyov]

Покажите ваш код полностью, того, что вы привели, уж точно недостаточно

[tyoma_koder]

Yuriy Vorobyov, код есть в ссылке ссылка на пример с гридами

[Yuriy Vorobyov]

tyoma_koder, только код по ссылке никак не связан с вашим скриншотом

[tyoma_koder]

Yuriy Vorobyov, связан, там та же проблема только оформление другое, блоки не переносятся на новую строку на маленьких экранах

Answer 1

[Vyach Gor]

у вас не задан метатег из за чего и происходит такой эффект - более подробно смотрите доки - link

Comments

[tyoma_koder]

не помогло

[Vyach Gor]

вот пример на codepen все отрабатывает - link

[Vyach Gor]

на всякий случай уточню вы ж добавляли вот это в свой head

<meta name="viewport" content="width=device-width, initial-scale=1">

?

[tyoma_koder]

Vyach Gor, если прописать тег мета в примере по ссылке то блоки начинают переноситься как надо, но если сделать то же самое на рабочем проекте то не работает

[tyoma_koder]

Vyach Gor, да, это. Сейчас всё внезапно стало переноситься как надо (я обновлял кеш), спасибо.