2013-11-10 2 views
0

Я испытываю проблему с отображением в IE 9 и 10. Нет такой проблемы в FF, Chrome.IE 10 несовместимый дисплей

На некоторых моих страницах, а затем только 25-30% страниц обновляется, содержимое помещается в конец бесконечно длинной страницы, оставляя пустое пространство видимым между нижней частью навигации и верхней частью контента. Частота выше при очистке истории/кеша.

код, по существу, как это:

<div class="column"> 
<div class="inner-column"> . . .</div> 
<div class="xyz">. . . </div> 
<div class="nmk"> . . . </div> 
</div> 

колонок «» DIV отображает бесконечно долго, и «внутренняя колонка» ДИВ и все ниже визуально сидеть на дне «колонна».

Поведение переключает в ответ на что-нибудь, которое переписывает экран, то есть масштабирование в/в, просмотр страницы и включение/выключение свойств css, независимо от свойства.

Эта структура кода является одинаковой для всех страниц, те, которые отображают эту проблему, и те, которые этого не делают.

Я попытался выяснить, что представляют собой «хорошие» страницы против «плохих» страниц и не может определить магическую комбинацию. Самая сложная часть состоит в том, что «плохие» страницы отображаются некорректно только часть времени. Это сайт Drupal 7, но я не думаю, что проблема связана с Drupal, в частности.

Кто-нибудь еще видел такое поведение?

+0

Можете ли вы воссоздать это в скрипке, чтобы мы могли увидеть пример вашего CSS и любого JS, который у вас есть? Трудно сказать что-либо, не зная ширины, высоты, положение, поплавок и т. Д. Этих элементов, а также контекст. –

+0

Да, я хочу это сделать. Но никогда не создавали скрипку раньше. На странице Drupal я просто копирую/вставляю просматриваемый источник - более или менее? – mastoll

+0

@IvanDurst, я создал эту скрипку http://jsfiddle.net/mastoll/LPjjS/. Хотя это вырезать/вставить прямо из источника просмотра, я не смог заставить его вести себя так, как описано выше, но у меня также возникают трудности с работой с JSFiddle в IE10, поскольку я не могу прокручивать панель, содержащую список ресурсов, поэтому я не могу настроить ресурсы достаточно. – mastoll

ответ

0

С помощью этой возможности я смог лучше охарактеризовать проблему и обнаружил, что она проистекает из левого столбца, в котором верхний элемент имеет верхнее поле X%. Когда любое из этих свойств изменяется (то есть родительский элемент не плавает или у первого ребенка есть крайний край: Ypx), ошибочное поведение не происходит.

Этот столбец перемещается по шаблону в ожидании отображения с несколькими колонками. Поскольку нет смысла, чтобы мне понадобился другой столбец для обертывания вокруг этого, я удалил float, и все хорошо.

Я не знаю, почему эта волшебная комбинация плавающего родителя и верхнего поля в процентах-ребенка заставляет верхнее поле расширяться до бесконечности, только в IE10. Кто-нибудь знает, как эти ценности реализованы, которые прольют некоторый свет на это?