min-width: 320px работает некорректно на Opera Mini для Android - PullRequest
1 голос
/ 14 февраля 2012

Тестирование некоторых медиазапросов в различных браузерах на Android и обнаружение, что Opera Mini 6.5 на моем Samsung Galaxy S, кажется, не применяет правила в следующем коде.

@media screen and (min-width: 320px){

Кажется, если я уменьшу значение до282. Opera Mini будет извинять стили внутри медиазапроса.

@media screen and (min-width: 282px){

Мне интересно, сталкивался ли кто-нибудь еще с проблемами с Opera Mini, которые неправильно обрабатывали медиазапросы на телефонах Android.Все остальные браузеры, которые я тестировал на Android, работали нормально с минимальной шириной: 320 пикселей, а также мои тесты Opera Mini на устройствах iOS.

Я настроил несколько тестовых страниц для проверкис изменениями в метатеге области просмотра.

h5bp Мобильные 2 метатеги - goo.gl / XfEVx

h5bp Мобильные 2 метатеги с максимальным масштабом, установленным на 1,0 - goo.gl / mgKJA

h5bp Мета-теги Mobile 3 - goo.gl / uxPsa

h5bp Мета-теги Mobile 2 с максимальным масштабом, установленным на 1.0, и тег видового экрана Opera CSS - goo.gl / McNhj

Только метатег просмотра - goo.gl / QMnmp

Я заметил эту проблему на моем Samsung Galaxy S Epic 4Gв книжной ориентации на Opera Mini 6.5.

Ответы [ 2 ]

2 голосов
/ 14 февраля 2012

Согласно Opera docs , Opera Mini 6.5 поддерживает медиазапросы и использует Presto 2.8 .Поддержка медиа-запросов в Presto 2.8 , кажется, завершена.

Вы пытались играть по шкале initial или device-width

<meta name="viewport" content="width=device-width"/>  

initial-scale=1.0

Я искал в наших отчетах об ошибках в Opera, но не видел ничего, связанного с этим.У вас есть ссылка на веб-страницу, чтобы мы могли провести дальнейшее тестирование.

1 голос
/ 05 апреля 2012

Вы видите одну и ту же проблему во всех версиях Opera и IE9?Вы используете Modernizr и Respond.js?У меня была очень похожая проблема, источником был Respond.js.

Я решил ее, связав Modernizr и Respond.js в один файл через http://www.initializr.com/.

Возможно, это поможет.

...