Не далее как вчера передо мной встала такая проблема, как верстка под IE Mobile. Возможно я недостаточно хорошо искала в рунете, но результаты моих поисков по запросам "IE Mobile особенности верстки" были чуть меньше, чем вообще никакими. А у заказчика тем временем был телефон именно с этим проклятущим браузером.
На англоязычных сайтах информации было чуть больше, что в конечном итоге мне и помогло решить мою проблему.
А проблема заключалась в следующем: под IE Mobile у меня форма не растягивалась под размер экрана.
Помогло в итоге применение мета тегов:
<meta name="HandheldFriendly" content="true" />
<meta name="MobileOptimized" content="width" />
Под другими мобильными браузерами отлично работали мета теги:
<meta content="yes" name="apple-mobile-web-app-capable" />
<meta content="minimum-scale=1.0, width=device-width, maximum-scale=0.6667, user-scalable=no" name="viewport" />
Head для мой страницы, корректно отображающийся под Android, IOS, Symbian и Windows Mobile выглядит вот так:
<head>
<meta content="yes" name="apple-mobile-web-app-capable" />
<meta content="minimum-scale=1.0, width=device-width, maximum-scale=0.6667, user-scalable=no" name="viewport" />
<meta name="HandheldFriendly" content="true" />
<meta name="MobileOptimized" content="width" />
</head>
Полезные ссылки по теме:
http://learnthemobileweb.com/
На англоязычных сайтах информации было чуть больше, что в конечном итоге мне и помогло решить мою проблему.
А проблема заключалась в следующем: под IE Mobile у меня форма не растягивалась под размер экрана.
Помогло в итоге применение мета тегов:
<meta name="HandheldFriendly" content="true" />
<meta name="MobileOptimized" content="width" />
Под другими мобильными браузерами отлично работали мета теги:
<meta content="yes" name="apple-mobile-web-app-capable" />
<meta content="minimum-scale=1.0, width=device-width, maximum-scale=0.6667, user-scalable=no" name="viewport" />
Head для мой страницы, корректно отображающийся под Android, IOS, Symbian и Windows Mobile выглядит вот так:
<head>
<meta content="yes" name="apple-mobile-web-app-capable" />
<meta content="minimum-scale=1.0, width=device-width, maximum-scale=0.6667, user-scalable=no" name="viewport" />
<meta name="HandheldFriendly" content="true" />
<meta name="MobileOptimized" content="width" />
</head>
Полезные ссылки по теме:
http://learnthemobileweb.com/
http://www.formsite.com/
http://www.squeed.com/sites/
шрифты в "Полезные ссылки по теме:" какие-то разные
ОтветитьУдалитьfixed
ОтветитьУдалить