Почему на моем телефоне не работает мой мультимедийный экран?

Question

Я использую следующий код в моем файле main.css для этого конкретного запроса:

@media only screen and (max-width: 480px) {
nav ul {
    margin: 0;
    padding: 0;
}
nav li {
    display: block;
    padding: 1% 1% 1% 1%;
    border-bottom: 1px solid #fff;
}
nav li:last-child{
    border-bottom: none;
}
main p {
    margin-bottom: 5%;
}
img {
    border: 0.5px 0.5px solid #000;
}
#brands img {
    width: 75%;
}
footer {
    font-size: 20px;
}
}

Странно, однако, когда я просматриваю свой веб-сайт на моем телефоне, ширина которого составляет 360 пикселей, запросне отображается, как при изменении размера окна Chrome на ноутбуке.

Я только что спросил моего брата, и он сказал мнечто есть что-то еще, что я должен использовать для мобильных версий ... Итак, что мне здесь не хватает?

Answer 1

Какой браузер вы используете на телефоне?Если это устаревший браузер, он не будет применять медиа-запрос из-за слова only перед экраном.