IE6 и 7 ошибка, вызывающая большую головную боль - PullRequest
Новая
       11

IE6 и 7 ошибка, вызывающая большую головную боль

1 голос
/ 07 января 2010

Эй, ребята, я часами смотрел на это и надеюсь, что новая пара или даже более опытная пара глаз на это могут помочь решить ее. Хотя поддержка IE6 не особенно нужна, IE7 есть, и это вызывает проблемы для моего скроллера изображений.

Может ли кто-нибудь взглянуть и посмотреть, что вызывает огромный интервал над и под изображением в родительском элементе div? Вы сможете лучше видеть в IE6, поскольку IE7 не отображает переполнение.

Вот ссылка: http://www.qwibbledesigns.co.uk/preview/aurelius/

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

Мэтт

Ответы [ 6 ]

2 голосов
/ 07 января 2010

Ваши встроенные стили для li устанавливают огромные размеры шрифтов для IE 

<li class="roundabout-moveable-item roundabout-in-focus" style="z-index: 400; position: absolute; filter: alpha(opacity=100); WIDTH: 600px; zoom: 1; height: 300px; font-size: 500px; top: -1px; left: -52px;" degrees="0" startPos="600,300,500" current-scale="1.0000" jQuery1262819600298="2">

Встроенные стили для Firefox для того же li - 

<li class="roundabout-moveable-item roundabout-in-focus" style="position: absolute; left: -52.5px; top: -1.5px; width: 600px; height: 300px; opacity: 1; z-index: 400; font-size: 12px;" degrees="0" startpos="600,300,12" current-scale="1.0000">

Это font-size:500px в IE против font-size:12px в FF, что вызывает дополнительное пространство.

0 голосов
/ 07 января 2010

Попробуйте добавить: 

position: relative;

к вашей области отладки кода (вверху http://www.qwibbledesigns.co.uk/preview/aurelius/css/reset.css)

0 голосов
/ 07 января 2010

Я иду через нечто подобное банкомату. Посмотрите на эту тему:

http://doctype.com/ie7-div-positionabsolute-problem

Кажется, что это связано с абсолютным позиционированием, есть несколько предложений, которые вы можете попробовать. Для меня ни один из них не работал надежно во всех браузерах, и мне пришлось сделать специальный взлом IE, чтобы компенсировать поля абсолютно позиционированного элемента, например: 

/margin-top: -50px;

Только IE выбирает этот стиль, остальные браузеры игнорируют его из-за / в начале строки.

0 голосов
/ 07 января 2010

Помогает ли это? 

.roundabout-moveable-item a{ 
 position:absolute;
 left:5px;
 top: 5px;
}
0 голосов
/ 07 января 2010

Попробуйте добавить их в Roundabout-Moveable-Item (по одному, чтобы увидеть, если один работает): 

.roundabout-moveable-item { display: inline; ... }

.roundabout-moveable-item { line-height: 0; font-size: 0; ... }
0 голосов
/ 07 января 2010

Я не могу точно сказать, и у меня не установлены инструменты отладки для IE, но, учитывая, что дополнительное пространство плюс изображение имеют ровно одну высоту окна просмотра (100%), я думаю, это один из них: 

.roundabout-moveable-item img { 
 ....
 height: 100% 
 }

или 

font-size: 100%

из таблицы стилей сброса.

Я узнаю завтра, был ли я прав.

Ночь!

...