IE7 игнорирует селектор атрибутов CSS только на страницах, поступающих с производственного сервера
На моем веб-сайте IE7, похоже, игнорирует некоторые селектора атрибутов CSS. Странно то, что это происходит только тогда, когда страница идет с производственного сервера. Если у меня есть тот же самый код на моем личном сервере или сохранен на моем жестком диске, он работает нормально. Вот пример, который вызывает проблему:
<!DOCTYPE HTML>
<html><head>
<title>IE display test</title>
<style type="text/css">
[type=button] {
display: block;
}
</style>
</head>
<body>
<input type="button" value="Button 1"/>
<input type="button" value="Button 2"/>
<input type="button" value="Button 3"/>
</body></html>
Поскольку на дисплее на кнопках установлено значение "block", они должны располагаться вертикально. Но только когда страница подана с моего производственного сервера, они расположены горизонтально. Когда я использую панель инструментов разработчика для проверки стиля, я не вижу свойство "display", как обычно. Единственное, что я могу подумать, это может привести к тому, что это URL-адрес страницы или заголовков ответов, поступающих с сервера. Я могу, возможно, понять это, экспериментируя, но это будет неудобно и трудоемко, поэтому прежде чем я это сделаю, я хотел бы спросить: Почему это происходит и что можно сделать с этим?
EDIT: Я придумал Fiddle. Он отлично выглядит на этом сайте.
РЕДАКТИРОВАТЬ 2: Вот заголовки ответов, поступающие с производственного сервера:
HTTP/1.1 200 OK
Сервер: Apache-Coyote/1.1
Content-Type: text/html; charset = utf-8
Content-Language: en-US
Content-Length: 291
Дата: ср, 18 янв 2012 21:32:48 GMT
РЕДАКТИРОВАТЬ 3: Вот заголовки ответов с моего личного сервера:
HTTP/1.1 200 OK
Дата: ср, 18 янв 2012 21:37:30 GMT
Сервер: Apache
Vary: Accept-Encoding
Контентное кодирование: gzip
Контент-длина: 176
Keep-Alive: timeout = 2, max = 100
Подключение: Keep-Alive
Content-Type: text/html; charset = utf-8
Производственный сервер не применяет сжатие gzip, потому что он делает это только для файлов выше определенного размера. Если я добавлю некоторые вещи, чтобы сделать файл достаточно большим, он использует gzip, и я все еще вижу проблему в IE7, так что это, похоже, не имеет ничего общего с gzip.
Я попробовал настроить мой персональный сервер для отправки заголовка "Content-Language", например, на производственном сервере, и это не вызвало проблемы.
Я не знаю, имеет ли какое-либо из других заголовков какое-либо отношение к этому. Я могу попробовать проверить их, но это будет довольно сложно, поэтому может потребоваться некоторое время.
EDIT 4: Я не замечаю эту проблему в IE8, даже если я включу режим совместимости. Я тестирую это на Windows XP, если это имеет значение.
EDIT 5: Я помещаю кодировку в заголовок Content-Type с моего личного сервера. Это не вызвало проблемы.
РЕДАКТИРОВАТЬ 6: Вот несколько скриншотов:
Работает с производственного сервера:
![IE7 test on production server]()
Работает с моего личного сервера:
![IE7 test on personal server]()
Загружается прямо с моего жесткого диска:
![IE7 test directly from my hard drive]()
EDIT 7: Наконец-то я понял, что вызывает это! Я попытался ввести javascript:alert(document.compatMode)
в адресную строку. Личные и прямые страницы показали CSS1Compat
, но на рабочей странице было показано BackCompat
. Кажется, что браузер находится в режиме quirks только при рендеринге страницы с производственного сервера. Пока я не знаю, почему это происходит или что с этим делать.
РЕДАКТИРОВАТЬ 8: Я не заметил подробностей: скриншот на самом деле из моей среды dev, которая эмулирует производственный сервер, но работает на моем собственном компьютере. Это привело бы к тому, что ответ BoltClock кажется правдоподобным, за исключением того факта, что та же проблема возникает на нашем фактическом производственном сервере, который находится на IP-адресе, соответствующем 173... *. Почему я вижу проблему на этом сервере? Это также частный IP-адрес? Может быть полезно знать, что фактический производственный сервер использует https.
РЕДАКТИРОВАТЬ 9:. Поскольку срок действия ресурса истек, проблема перестала отображаться на рабочем сервере, но она все еще отображается в моей среде dev (10.1.10.34). Понятия не имею почему. Я думаю, что я буду обвинять его в космических лучах, если я не смогу придумать еще несколько доказательств.
Ответы
Ответ 1
Как обсуждалось в комментариях, в соответствии с этим ответом на тридцать, и этот ответ scunliffe, он скорее всего, будет следствием функции безопасности в Internet Explorer. Ваш производственный сервер живет в вашей интрасети и к нему обращаются через частный IP-адрес класса A (t20 > ), который, как я подозреваю, в основном заставляет IE7 отображать страницы в режиме quirks (и IE8 и новее для отображения страниц в представлении совместимости).
Все это только предположение, хотя, я боюсь, я не смог воспроизвести вашу проблему в любом браузере IE в любой системе, по крайней мере, на вашем личном сервере или в моих собственных файлах. Если ваш производственный сервер открыт для открытого доступа, а не только технически, возможно, вы можете предоставить ссылку на него, чтобы мы могли отлаживать дальше, так как проблема явно локализована только для вашего производственного сервера.
Ответ 2
Я просто играл с кодом на вашем личном сервере (eliasz.net), файл, который был передан по протоколу file://и обслуживался на локальном сервере.
Ваш персональный сервер и когда он передается через файл://, оба рендеринга корректно отображаются, поскольку они отображаются в режиме "edge" (последний, а не режим совместимости). Однако на вашем производственном сервере и на сервере разработки они отображаются в режиме совместимости. Как сказал BoltClock, интрасети делают это по умолчанию. Очевидно, что это применимо к вашему серверу разработки (на локальном IP, например 10.1.10.34).
Я думаю, что производственный сервер также находится в вашей локальной сети, хотя он имеет открытый статический IP-адрес. Другими словами, когда вы находитесь в локальной сети, производственный сервер обслуживается через локальную сеть, а не через Интернет. Следовательно, IE7 по-прежнему рассматривает его как сайт интрасети. Используйте nslookup
, чтобы проверить, как IE7 разрешает имя домена.
Чтобы обойти эту проблему, вы можете добавить это в свой заголовок:
<meta http-equiv="X-UA-Compatible" content="IE=9" >
а затем отключите настройку в вашем IE, которая заставит ее отображать сайты интрасети в режиме совместимости.
Ответ 3
Помните, что определенные условия могут заставить Internet Explorer отображать страницы в режиме совместимости документов, отличном от того, который указан на веб-странице. К ним относятся, помимо прочего, следующие ситуации:
-
Для страницы включен режим совместимости.
-
Страница загружается в зону интрасети, а Internet Explorer настроен на использование представления совместимости для страниц, загруженных из зоны интрасети.
-
Internet Explorer настроен для отображения всех веб-сайтов в представлении совместимости.
-
Internet Explorer настроен на использование списка просмотра совместимости, который определяет набор веб-сайтов, которые всегда отображаются в представлении совместимости.
-
Инструменты разработчика используются для переопределения параметров, указанных на веб-странице.
-
На веб-странице была обнаружена ошибка макета страницы, и Internet Explorer настроен на автоматическое восстановление после таких ошибок путем повторного открытия страницы в представлении совместимости.
Источник: http://msdn.microsoft.com/en-us/library/cc288325%28VS.85%29.aspx
Из этого мы можем получить ваш запуск сайта в локальной интрасети, т.е. 7 не могут отключить этот рендеринг, как в ie8, вы можете остановить локальные сайты интрасети, выполняющие рендеринг в режиме совместимости.
10.x.x.x сервер для создания IP-адресов
file://по существу локальный хост
http://через локальный сервер
UPDATE:
Хорошо, что у IE много проблем, запущенных в интрасети, IE8 + - проблема выше, поскольку вы упомянули, что IE7 не использует режим совместимости, у которого есть причуды и стандарт. Знание microsoft, хотя они, возможно, испортили его в одном из обновлений патча ie7, но я ненавижу предположения, поэтому, если кто-то знает, пожалуйста, дайте мне знать.
Чтобы решить проблему, я боюсь, что не могу дать вам решение на уровне программного обеспечения или аппаратное изменение. Если он всегда будет местом интрасети, я рекомендовал обновить сетевые браузеры до минимального значения8.
У меня есть html, css fix однако (я знаю, что это не то, что вы хотите):
<!DOCTYPE HTML>
<html>
<head>
<title>IE display test</title>
<style type="text/css">
#buttons {
}
#button {
display:block;
}
</style>
</head>
<body>
<div id="buttons">
<input id="button" type="button" value="Button 1"/>
<input id="button" type="button" value="Button 2"/>
<input id="button" type="button" value="Button 3"/>
</div>
</body>
</html>
Кажется, это не нравится [type="buttons"]
с помощью display:block;
.
Ответ 4
Я вижу, что одна страница -.html, а другая -.php. Возможно, ваша php-страница будет иметь некоторый символ (возможно, скрытый) до doctype. Это может повлиять на то, как IE принимает HTML и CSS.
Ответ 5
Я просто столкнулся с этим как с IE8, так и с IE9, и я нашел решение!
Теперь это может не соответствовать точно IE7, но оно должно указывать на вас в правильном направлении.
- Просмотрите меню для элемента под названием "Вид совместимости".
- Дайте ему щелчок, и откроется диалоговое окно, в котором вы можете добавить веб-сайты, которые будут отображаться в "Просмотр совместимости".
- Посмотрите ниже списка флажка "Отобразить сайты интрасети в представлении совместимости"
- Снимите флажок.
Похоже, что Microsoft рассматривает хост-часть "интрасети", когда она:
- присоединенный к одному домену,
- идентифицированное с помощью неквалифицированного имени хоста (ex "server" vs "server.example.com" ) или
- идентифицированный частным IP-адресом (10.x.x.x, 172.16-31.x.x, 192.168.x.x)
Похоже, что ничто не считается "интрасети", если клиентская система не присоединена к домену.
Ответ 6
У меня такое чувство, что оно имеет какое-то отношение к серверу (на основе apache/coyote, я думаю, вы используете tomcat?) и либо что-то делать с пробелами, либо BOF, либо с неправильной установкой utf-8 (i "Мы слышали о проблемах, когда заголовок утверждает, что он utf-8, но не является). Если перед объявлением html есть пробелы, это может также вызвать его переход в режим quirks. Хотя я могу ошибаться, у меня возникает ощущение, что ваша проблема похожа на эту Почему ie7 всегда в режиме Quirks?
Ответ 7
Я не думаю, что ответ - это тот сервер, с которого он вышел, но более случай добавления двойных кавычек вокруг значения в селекторе CSS.
Попробуйте следующее:
<!DOCTYPE HTML>
<html><head>
<title>IE display test</title>
<style type="text/css">
[type="button"] {
display: block;
}
</style>
</head>
<body>
<input type="button" value="Button 1"/>
<input type="button" value="Button 2"/>
<input type="button" value="Button 3"/>
</body></html>