CSS Что я не так сделал в @media screen?

[T1cKz]

суть в том, через f12 в хроме тестирую разрешение, ниже моего 1920х1080 если ставлю, то он видит только 768-1024, а ниже нет, хоть могу поставить 320х320 экранчик
Почему?

//ТУТЬ КОД ОСНОВЫ

@media (max-width : 480px) { /* с телефона */

}
@media (min-width : 481px) and (max-width : 767px) { /* с  китайского дохуяпикселей в ширину телефона */

}
@media (min-width: 768px) and (max-width: 1024px) { /* с дерьмо-пк или с телефона в горизонтальном положении */

}

p.s. он принимает размер... т.е. медиа работает по сути, но размер почему-то 1024 максимальный, хотя в отрисовке 375х667px

Решил вопрос постановкой в хедер html файла

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

 

[Lucifer_Dishamory]

Используй

@media all and (max-device-width: 400px)