У нас есть дизайн страницы, который отлично работает в каждом браузере ПК, который я пробовал, но выглядит странно при просмотре на iPhone или iPod Touch.
Проблема в том, что фоновое изображение по центру очень высокое:
#content_container
{
background-image:url('content-background.jpg');
background-position:top center;
background-repeat:no-repeat;
width:1020px;
height:auto;
}
Изображение content-background.jpg очень высокое (3000 пикселей) и предназначено для «раскрытия» по мере увеличения DIV из-за содержимого.
Вам нужно будет взглянуть на страницу и полный CSS, чтобы понять, поэтому я удалил все остальное из дизайна и заново создал проблему с этим примером:
http://files.codeulike.com/static/cssexample/example.htm
(пример состоит из 1 HTML-файла, 1 CSS-файла и 3 изображений)
Вы увидите, что в IE8, Firefox, Chrome вы получите красивую зеленую коробку. Но в браузере iOS длинное тонкое фоновое изображение масштабируется, и все становится странным.
(я использую iPod Touch 2-го поколения, но полагаю, что такая же проблема будет и в других устройствах iPhone / iPod).
Любая помощь с благодарностью!