Может кто-нибудь помочь мне разобраться в этой ошибке? С Firefox он работает нормально, но с Internet Explorer 7 - нет. Вроде не понимаю display: inline-block;
.
HTML:
<div class="frame-header">
<h2>...</h2>
</div>
CSS:
.frame-header {
height:25px;
display:inline-block;
}
html
internet-explorer-7
css
lanthuong
источник
источник
Ответы:
display: inline-block;
Взлом IE7 выглядит следующим образом:По умолчанию IE7 поддерживает только
inline-block
естественныеinline
элементы ( таблица совместимости Quirksmode ), поэтому вам понадобится этот прием только для других элементов.zoom: 1
есть для запускаhasLayout
поведения, и мы используем звезду свойство хак для установиваdisplay
дляinline
только в IE7 и ниже (более новых браузерах не будет применяться , что).hasLayout
иinline
вместе они будут вызыватьinline-block
поведение в IE7, так что мы счастливы.Этот CSS не будет проверяться и в любом случае может испортить вашу таблицу стилей, поэтому использование таблицы стилей только для IE7 с помощью условных комментариев может быть хорошей идеей.
источник
*zoom:1;
запускать hasLayout. Так что более ясно, что они*zoom
и*display
идут вместеОбновить
Поскольку никто больше не использует IE6 и 7, я представлю другое решение:
вам больше не нужен хак, потому что IE8 поддерживает его сам по себе.
Для тех, кто должен поддерживать эти браузеры каменного века до IE8 (дело не в том, что IE8 такой старый, слишком кашляющий ):
для учета контроля версий IE используйте некоторый условный класс в
<html>
теге, как утверждает Пол Айриш в своей статьеБлагодаря этому у вас будут разные классы в html-теге для разных браузеров IE.
Вам нужен следующий CSS
Это подтвердит, и вам не понадобится дополнительный файл CSS.
Старый ответ
источник
inline-block
кframe-header
элементу. Или изменить сinline-block
помощьюframe-header
в CSS селекторов.IE7 не поддерживает «inline-block» должным образом, подробнее здесь: LINK
Вместо этого можно использовать: «inline».
Чего именно вы пытаетесь достичь? Сделайте нам пример и поместите сюда: http://jsfiddle.net/
источник
используйте встроенный, он работает с такими селекторами для элементов списка:
или, если быть точным:
источник
inline
не то же самое, чтоinline-block
. Например,height: 25px;
в примере не вступит в силу, если элемент естьinline
. Также вопрос ничего не говорит о списках.