IE 不在 FLOAT 左类中显示图像。在 Chrome 和 Firefox 中有效

【问题标题】：IE doesnot display an image in FLOAT left class.. Works in Chrome and FirefoxIE 不在 FLOAT 左类中显示图像。在 Chrome 和 Firefox 中有效
【发布时间】：2014-11-25 03:21:25
【问题描述】：

我的问题出在 IE（版本 11 和 Vista 上的一些旧版本）中。. holzhandel.cz 页面在 IE 中不显示图像（在 chrome 和 fox 中显示）。这是一个非常简单的页面，该类只有向左浮动和简单的 img 标签。

（css文件）

.pic img{
    height: 600px;
    width: 100px;
}

（代码）

<div id="lg-5">< /div>
<div id="lg-3" class="pic">
<img src="images/1.jpg">
</div>

有什么想法吗？

谢谢

【问题讨论】：

标签： html css google-chrome internet-explorer

【解决方案1】：

问题来自.pic 类，因为您使用的是css3 属性display: initial;，IE 不支持该属性。

更准确地说，在样式表formate.css 中，390 行具有以下规则：

.pic {
    display: none;
}

然后，在第 395 行，此规则在媒体查询中被覆盖：

@media (min-width: 500px) {
    .pic {
        display: initial;
    }
}

IE 和其他不兼容 CSS3 的浏览器不支持。

所以我的建议是使用display: block;，像这样：

@media (min-width: 500px) {
    .pic{
        display: block;
    }
    ....
}

您可以在此处阅读有关此 css display: initial; 属性的更多信息： https://developer.mozilla.org/en-US/docs/Web/CSS/initial

【讨论】：