Встроенный блок не работает в internet explorer 7, 6
у меня есть этот код CSS с inline-block
. Может кто-нибудь сказать мне, как заставить его работать в Internet Explorer 6 и 7. Есть идеи? Может быть, я делаю что-то не так? Спасибо!
#signup {
color:#FFF;
border-bottom:solid 1px #444;
text-transform:uppercase;
text-align:center;
}
#signup #left {
display: inline-block
}
#signup #right {
background-image:url(images/signup.jpg);
border-left: solid 1px #000;
border-right: solid 1px #000;
display: inline-block;
padding:1% 2%
width:16%;
}
#signup #right a { font-size:100%; font-weight:bold }
#signup #right p { font-size:90%; font-weight:bold }
#signup a:hover { color:#FFF; text-decoration:underline }
2 ответа:
в IE6/IE7,
display: inline-block
работает только с элементами, которые естественно inline (например,span
s).чтобы заставить его работать на других элементах, таких как
div
s, вам нужно это:#yourElement { display: inline-block; *display: inline; zoom: 1; }
*display: inline
использует "безопасный" CSS хак, чтобы применить к только IE7 и ниже.для IE6/7,
zoom: 1
предоставляет hasLayout. Наличие "макета" является обязательным условием дляdisplay: inline-block
всегда работать.можно подать заявку это обходное решение при сохранении допустимого CSS, но на самом деле не стоит думать об этом, особенно если вы уже используете какие-либо свойства с префиксом поставщика.
читать это подробнее о
display: inline-block
(но забывает о-moz-inline-stack
, это было необходимо только для теперь древнего Firefox 2).
*display:inline
работает IE7 hack. Но, вы можете добавитьzoom:1
в коде как*background:#fff; *display:inline; zoom:1
. Здесь вы можете поместить свой цветовой код фона. Иногда вы не увидите макет на экране, скажем, например, список-элементы не будут отображаться на экране. Затем, в таких случаях это отлично работает и появляется, как и в других браузерах.