Как обеспечить полную поддержку display: inline-block; в IE 6(7) и FF2? Вопрос я думаю актуальный, так как часто возникает при реализации горизонтального меню.
Кроссбраузерный display: inline-block;
2
Спросил
Популярные ответы
Новые
Лучшие
2
Для решения проблемы нужно элементу присвоить display: inline; zoom: 1;
. С помощью zoom: 1;
мы присваиваем элементу hasLayout
.
Таким образом элементы с display: inline; zoom: 1;
в IE 6 и 7 будут отоборажаться как inline-block
. Конечно же не забываем обрамлять условными комментариями код написаный исключительно для IE.
Для корректного отображения inline-block в FF2 нужно элементу прописать следующие стили:
display: -moz-inline-stack;
display: inline-block;
То есть стиль должен выглядеть как то так:
.inline-block {
display:-moz-inline-stack; /* for FF2*/
display:inline-block; /* normal browsers */
zoom:1; /* for IE (hasLayout true) */
*display:inline; /* for IE */
}
Взято отсюда
Вот ещё одна заметка о кроссбраузерном использовании inline-block