IE7不理解display: inline block
有没有人能帮我解决这个问题？在Firefox上它可以正常工作，但在Internet Explorer7上就不行了。它似乎不理解display: inline-block;。
html:
<div class="frame-header">
<h2>...</h2>
</div>css:
.frame-header {
height:25px;
display:inline-block;
}回答 4
Stack Overflow用户
发布于 2011-07-01 15:42:45
IE7 display: inline-block;黑客攻击如下：
display: inline-block;
*display: inline;
zoom: 1;默认情况下，IE7只支持在自然语言元素( naturally inline elements，Quirksmode Compatibility Table)上使用inline-block，因此您只需要对其他元素使用此技巧。
zoom: 1是用来触发hasLayout行为的，我们使用star property hack在IE7和更低版本中将display设置为inline (较新的浏览器不会应用这一点)。hasLayout和inline在一起基本上会触发IE7中的inline-block行为，所以我们很高兴。
这种CSS不会进行验证，而且可能会使您的样式表变得一团糟，因此通过conditional comments使用仅支持ie7的样式表可能是个好主意。
<!–-[if IE 7]>
<link rel="stylesheet" href="ie7.css" type="text/css" />
<![endif]–->Stack Overflow用户
发布于 2011-09-28 23:49:40
更新
由于没有人再使用IE6和7，我将提出一个不同的解决方案：
你不再需要黑客，因为IE8
对于那些必须在IE8之前支持那些石器时代的浏览器的人(并不是说IE8太老了，太干咳)：
对于IE版本控制的账号，在<html>标签中使用一些条件类，如his article中的Paul Irish状态
<!--[if IE 7]><html class="no-js lt-ie9 lt-ie8"><![endif]-->
<!--[if IE 8]><html class="no-js lt-ie9"><![endif]-->
<!--[if gt IE 8]><!--><html class="no-js"><!--<![endif]-->这样，对于不同的IE浏览器，在html-tag中就会有不同的类
您需要的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 */
}Stack Overflow用户
发布于 2011-07-01 15:29:18
IE7不能正确支持'inline-block‘，更多信息请点击此处：
使用可以使用：'inline‘代替。
你到底想要达到什么目的？给我们举个例子，放在这里：
https://stackoverflow.com/questions/6544852
复制相似问题