IE7 не понимает дисплей: встроенный блок

Question

IE7 не понимает дисплей: встроенный блок

может кто-нибудь, пожалуйста, помогите мне разобраться с этой ошибкой? С Firefox его работает нормально, но с Internet Explorer 7 его нет. Кажется, он не понимает display: inline-block;.

html:

<div class="frame-header">

    <h2>...</h2>

</div>

css:

.frame-header {

    height:25px;

    display:inline-block;   

}

605 4

html css internet-explorer-7

4 ответов:

Comments

Ничего не найдено.

kapa · Accepted Answer · 2012-08-22 11:49:07

в ИЕ7 display: inline-block; взломать следующим образом:
display: inline-block;
*display: inline;
zoom: 1;
по умолчанию IE7 поддерживает только inline-block на естественно inline элементов (Таблица Совместимости Quirksmode), так что вам нужно только это хак для других элементов.

zoom: 1 есть ли триггер hasLayout поведение, и мы используем star property hack настройки display до inline только в IE7 и ниже (новые браузеры не применять). hasLayout и inline вместе будет в основном триггер inline-block поведение в IE7, так что мы счастливы.

этот CSS не будет проверять и может сделать вашу таблицу стилей испорченной в любом случае, поэтому используйте только таблицу стилей IE7 через условные комментарии может быть хорошей идеей.
<!–-[if IE 7]>
<link rel="stylesheet" href="ie7.css" type="text/css" />
<![endif]–->

HerrSerker · Accepted Answer · 2014-08-25 13:26:25

обновление

поскольку никто больше не использует IE6 и 7, я представлю другое решение:
вам больше не нужен Хак, потому что IE8 поддерживает его сам по себе

для тех, кто должен поддерживать эти браузеры каменного века до IE8 (это не то, что IE8 тоже старый кашель):
За счет контроля, т. е. версии, использовать несколько условных классов в <html>тег Пол Ирландских говорится в статье


<html class="no-js">
при этом у вас будут разные классы в html-теге для разных браузеров IE

CSS вам нужно следующим образом
.inline-block {
    display: inline-block;
}
.lt-ie8 .inline-block {
    display: inline;
    zoom: 1;
}
это подтвердит, и вам не нужен дополнительный файл CSS

ответ
.frame-header
{
    background:url(images/tab-green.png) repeat-x left top;
    height:25px;
    display:-moz-inline-box;    /* FF2 */
    display:inline-block;   /* will also trigger hasLayout for IE6+7*/
}
/* Hack for IE6 */
* html .frame-header {
    display: inline; /* Elements with hasLayout and display:inline behave like inline-block */
}
/* Hack for IE7 */
* + html .frame-header {
    display: inline; /* Elements with hasLayout and display:inline behave like inline-block */
}

Iladarsda · Accepted Answer · 2011-07-01 10:29:18

IE7 не поддерживает 'inline-block' должным образом, больше информации здесь:ссылке
Use может использовать:' inline ' вместо этого.

Что именно вы пытаетесь достичь? Сделайте нам пример и поставьте сюда: http://jsfiddle.net/

MiddleKay · Accepted Answer · 2013-03-14 07:32:53

используйте встроенный, он работает с такого рода селекторов для элементов списка:
ul li {}
или конкретнее:
ul[className or name of ID] li[className or name of ID] {}