CSS - IE7 игнорирует поля в первом элементе списка?

Question

Если перейти к первому элементу блога (Mona) и развернуть его с помощью значка «+». Миниатюры изображений выровнены по 24 пикселя слева, используя поле. Это работает в любом браузере, кроме IE7, который игнорирует поля в первом элементе списка.

http://www.dririser.co.uk/index.php

CSS

.artistMeta li {
float: left;
margin: 0 0 24px 24px;
position: relative;
width: 160px;
}

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

Почему ie7 игнорирует левое поле в моем первом элементе списка (только)?

Есть идеи?

Answer 1

Проблема, с которой сталкивается IE7, заключается не в вашем CSS-файле, а в вашем javascript в global.js .В частности, следующая строка ...

$(".artistMeta > li:nth-child(3n+1)").addClass("articleSlideOdd");

В соответствии с соглашением в CSS JQuery начинает счётчик дочерних элементов с 1 для n-го дочернего элемента (так как для первого дочернего элемента это nth-child(1)), где as, ie7 ожидает, что он начнется с 0. Так что с ie7 3n + 1 соответствует 2-й, 5-й, 8-й элемент и т. д.

Похоже, JQuery неправильно обрабатывать ie7, поэтому вам понадобятся два оператора для покрытия ie7 и всего остального.

Answer 2

просто быстрая проверка .. не уверен, что это сработает ... но попробуйте добавить display:block на li и не используйте сокращение для поля, вместо этого используйте margin-left и margin-bottom. .. мне кажется, что IE не обновляет стиль элементов, потому что когда я проверяю элементы, навигатор добавляет правильные поля ...

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

и если это не сработает .. тогда я понятия не имею, что может быть не так = P. Надеюсь, это поможет ...

Удачи!