ширина = ширина устройства не работает в Mobile IE

Question

Я пытаюсь сделать сайт, который хорошо работает на мобильных телефонах. Пока что все телефоны, которые я тестировал, работают хорошо, но телефоны с Windows Mobile IE. Кажется, что Mobile IE просто читает над <meta id="viewport" name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=yes"/> и не устанавливает ширину в device-width.

Кто-нибудь имеет опыт использования этого или каких-либо советов по улучшению просмотра сайта в Mobile IE?

Спасибо за помощь!

Answer 1

Мобильный IE, похоже, учитывает только метатег viewport, если вы указываете фактическую ширину. Чтобы ширина страницы соответствовала фактической ширине устройства, используйте мета-тег mobileoptimized с содержимым, установленным в 0:

<meta name="mobileoptimized" content="0" />

Подробности в MSDN: http://msdn.microsoft.com/en-us/library/dd938878.aspx

Если вы объедините это с метатегом viewport, как указано выше, это даст вам то, что вы ищете в большинстве мобильных браузеров.

Answer 2

в CSS, напишите это

@-ms-viewport{
    width: device-width;
}

или в формате html:

<style type="text/css">
  @-ms-viewport{
  width: device-width;
  }
</style>

и после работы устройства ширина

Answer 3

Для версий IE Mobile, более старых, чем Windows Phone 7, окно просмотра не распознается - вы должны использовать тег mobileoptimized, как показано выше.