Я взял на себя создание веб-сайта, который вообще НЕ был предназначен для мобильных устройств. Клиент должен иметь возможность, по крайней мере, перемещаться по сайту через мобильное устройство, поэтому я пытаюсь сделать так, чтобы сайт выглядел точно так же на мобильном устройстве, как и в браузере, и просто позволяйте клиенту сжимать и масштабировать. Это. Мне пришлось внести небольшие коррективы с помощью медиа-запросов, но это уже другая история.
Сайт выглядит великолепно с <meta name="viewport" content="user-scalable=yes" />, но не похоже, что какой-либо из моих медиа-запросов вступает в силу... Когда я помещаю width=device-width в метатег, сайт взрывается и выглядит так, как будто он отображается с увеличением 300%. Когда я добавляю любой из следующих initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, я получаю тот же эффект, что и при простом добавлении width=device-width.
Пока что единственное, что дало мне возможность приблизиться к тому, что я ищу, — это user-scalable=yes в метатеге без каких-либо других действий, но медиа-запросы не действуют. Обязательно ли иметь width=device-width или initial-scale для медиа-запросов?
Вот один медиа-запрос, который я использую, но он не действует:
@media only screen and (max-width: 879px) {}
