Случайный стиль CSS в iPhone Safari - PullRequest
Новая
       4

Случайный стиль CSS в iPhone Safari

0 голосов
/ 20 февраля 2012

У меня болезненная проблема CSS, которая, по-видимому, вызвана Disqus CSS.

Кажется, что Disqus CSS приводит к тому, что текст основного содержимого моей страницы случайным образом изменяет размеры по частям.Нажатие на кнопку «Обновить» случайным образом увеличит размер текста, уменьшит его и выделит жирным шрифтом.Кажется, что это происходит только в Safari на iPhone (реальном и симуляторе) и прекрасно работает в Firefox, IE, Android и iPad Safari.Отключение комментариев Disqus устраняет проблему.Я пытался изменить темы Disqus и включить и выключить мобильное представление.

Ниже вы можете видеть, как одна и та же страница отображается по-разному при каждом нажатии кнопки «Обновить» ( живой сайт - он должен выглядеть следующим образом )

Random styling Same page after refresh

Любая помощь будет принята с благодарностью.

1 Ответ

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

Вы можете попробовать применить -webkit-text-size-Adjust: нет; и ориентация на код Disqus? Если я помню, Disqus не использует iframes, поэтому он должен работать, если иерархия, которую вы используете, сильнее их.

Больше информации здесь: http://css -infos.net / недвижимость / -webkit-текст-размер-регулировки

Надеюсь, это поможет:)

Редактировать: Я только подумал, когда писал этот комментарий ниже. Вы можете отсортировать это, установив ширину области просмотра либо явно, либо по ширине устройства.

Например, это сделает окно просмотра на iphone шириной 320px в портретной ориентации и 460px в альбомной (думаю, верно?). 

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

Из скриншотов я думаю, что это на самом деле слишком мало, поэтому что-то вроде этого может быть лучше. 

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

Именно поэтому размер текста изменяется в первую очередь. IPhone масштабирует эти 800px, чтобы соответствовать и портрету и пейзажу. Однако в портретной ориентации это может сделать шрифт слишком маленьким, поэтому он увеличивается.

Подробнее см. Здесь: https://developer.apple.com/library/ios/#DOCUMENTATION/AppleApplications/Reference/SafariWebContent/UsingtheViewport/UsingtheViewport.html

...