IE Whitespace, как ошибка, но не ошибка пробела

Question

У меня здесь настроено меню CSS:

http://pans.saebermedia.com/

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

Я заметил две проблемы.В подменю (скажем, «Ресурсный центр») между каждым элементом есть дополнительное расстояние, которое, когда курсор проходит через него, закрывает меню.Это похоже на ошибку IE Whitespace, но я использовал PHP, чтобы убрать пустое пространство.Если я использую float: left; clear: left;это приводит к тому, что меню в Firefox и IE имеют одинаковую длину.

Кто-нибудь знает, что происходит?

Answer 1

Я тестировал свое решение только на IE 7.

в элементах:

li.menu-item

Вы должны изменить

display:block;

до

display:inline;

Answer 2

Ух, это заняло у меня немного. Вы должны действительно уменьшить количество CSS, которое вы бросаете на эти элементы. Вы перезаписываете много каскадных значений и т. Д. Однако есть два основных значения, с которыми IE7 сталкивается с проблемой.

Первый - min-width на #main-nav > ul > li ul a. По какой-то причине IE7, имеющий это значение на a, заставляет его игнорировать, что это display: block. Вероятно, это связано с неправильным восприятием родителя как inline-block (см. # 2).

Второй - это display: inline-block, наследуемый li s в .sub-menu от li.menu-item выше ul.submenu. Когда я удаляю эти элементы, IE7 начинает действовать соответствующим образом.

Во всех случаях это не имеет никакого отношения к тому, что вы называете "IE Whitespace Bug". Элементы inline-block обрабатываются не иначе, чем элементы inline, когда вычисляются коллапсы пробелов. Это согласно спецификации . В IE нет ошибки, любой браузер, который не разбивает пробелы на 1 единичный пробел между inline и inline-block элементами (без использования bikesheding: discard), нарушает спецификацию.