дисплей: таблица dosen't работает в ie6 & ie7

Question

Я создаю меню, но оно не работает в ie6 & ie7 из-за display:table. как я могу это сделать, чтобы работать в IE6 и IE7 со стилем display:table

есть мой пример

http://jsfiddle.net/amkrtchyan/fCsax/

, но он не работает в IE6 и IE7

Answer 1

IE6 и IE7 не поддержка дисплея: таблица;

http://www.quirksmode.org/css/display.html

Вы можете использовать реальную таблицу, если ее табличные данные, в противном случае вы можете использовать списки (UL) и встроенный блок с * Дисплей: инлайн хака и масштабирования: 1 для IE7 и ниже.

Answer 2

IE7 не поддерживает отображение: таблицы, так что вы должны восстановить меню по-другому, или вы можете использовать JS для этого

проверки этого IE7 and the CSS table-cell property

Answer 3

Я думаю, что IE6 не поддерживает CSS версию, которую вы использовали. Используйте совместимый CSS с IE6.

Answer 4

Единственный способ заключается в использовании таблицы для IE6 & IE7, используя условные комментарии:

<!--[if lte IE 7]> special markup for IE6 and IE7 <![endif]--> 

Итак, добавить таблицу, Tr, и т.д теги правильно, только для IE в ваших элементов меню.

Другим решением является использование: display: inline-block;

Answer 5

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

Я думаю, что вы можете произвести аналогичный результат в IE 6 и 7, используя display:inline-block по пунктам меню:

• http://jsfiddle.net/fCsax/3/

Различие между оригиналом и этой версией:

1. Удалить display:table от .menu
2. Добавить overflow: hidden в .menu так, что его закругленные углы обрезать свои пункты меню слишком
3. Удалить display:table-row из .menu ul
4. Добавить display:inline в .menu li
5. Перемещение отступы от .menu li к .menu ul li a
6. Добавить display:inline-block в .menu ul li a

У меня был быстрый взгляд в IE 6, и я думаю, что он работает:

• http://jsfiddle.net/fCsax/3/embedded/result/