CSS padding исчезает в IE8/jquery

Question

Это странный, который съел много часов моего времени. Вот фотография, так как я могу только поставить 1 ссылку: http://www.screencast.com/t/byVmPE6H. Пояснения следуют.

В принципе, мне нужно достичь пункта 1 на фотографии.

Обратите внимание, что левое заполнение больше, чем правое. Исходным свойством для заполнения является:

padding: 12px 15px; (т. Е. Вертикальная прокладка 12px, горизонтальная 15px).

Затем, с помощью JQuery, на странице загрузки, я установить левый отступ до некоторого значения следующим образом:

$(links[0]).attr("style","padding-left : "+padding+"px;"); (я мог бы я использовал .css(), эффект и проблема остается такой же)

Это прекрасно работает во всех браузерах, как вы уже догадались, кроме IE. Я не говорю о версиях 6 или 7, но только в IE 8. Итак, в IE 8, на загрузке страницы, я получаю пункт 2 с фотографии выше.

Помните, что это происходит только при загрузке страницы. После того, как я перейду с указателем на ссылку (т. Е. Запустив событие mouseover), правое заполнение вернется на место, и оно выглядит идеально, как в первой ссылке (на самом деле это первая фотография из IE8!).

Устранение строки jquery выше не вызывает такого же поведения, 15px paddings в порядке. Для ссылок на «mouseover» нет ссылок на обработчик событий. Там только это CSS свойство для наведения курсора:

#navigation li.first:hover a{

background: transparent url(../images/menu_on_left.png) left top no-repeat;

}

(т.е. только изменение фонового изображения, не совсем иной)

Таким образом, при загрузке страницы, если Я использую jquery, чтобы изменить левое заполнение, правый исчезает. При переходе мыши справа появляется надпись. Я не могу объяснить, почему это происходит. Если я не могу найти решение, я действительно подумываю вычислить положение всех пунктов меню и упорядочить их с позиции: абсолютной. Звучит очень плохо, я знаю.

Может ли кто-нибудь просветить меня, пожалуйста?

Answer 1

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

1. удалить все остальные пункты меню (через клон(), а затем удалить(), к сожалению, у меня не было JQuery 1,4 доступны или я бы уже использовали отсоединение(), но это работает просто отлично),

2. изменение набивка с помощью CSS()

3. повторно вставить другие пункты меню. Теперь они воспринимают новое дополнение на первом элементе и правильно расположены.

Сумасшедший, не так ли?просто другая причина ненависти IE для меня ...

Надеюсь, это поможет любому, у вас будет хороший день!