Question

首先，图像消失了，我通过在标题中放置<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />来修复，这很好！

现在图像显示但在第二个块 [IMG]之后重叠。我很难解决这个因为无法安装IE 7-9，我依靠仿真器这样的netrenderer :(

标题是<!DOCTYPE html>尝试了其他一些但是有任何改变。

容器是这样的：

<div class="post-container-odd" >
<h2><a href="http://site.com/destinos/africa-ilhas/">África &amp; Ilhas</a></h2>
<div class="thumbnail"><a href="http://site.com/destinos/africa-ilhas"  title="Ilhas Maldivas"><img src="http://site.com/wp-content/uploads/2012/07/maldivas-22-380x200.jpg" title="" alt=""/></a></div>
</div>

<div class="post-container-even" >
<h2><a href="http://site.com/destinos/america-do-norte-caribe/">América do Norte &amp; Caribe</a></h2>
<div class="thumbnail"><a href="http://site.com/destinos/america-do-norte-caribe"  title="Chicago"><img src="http://site.com/wp-content/uploads/2012/07/chicago-29-380x200.jpg" title="" alt=""/></a></div>
</div>

CSS就是这样：

.post-container-even{float:left;margin:0 0 20px 0;display:table}
.post-container-odd {float:left; margin: 0 5px 20px 0}

添加了ie.css（解决了一些问题，但仍然重叠）：

.post-container-odd { float:left; margin: 0 5px 30px 0; display:inline;}

.post-container-even{ float:left; margin:0 0 30px 0; display:inline; clear: left}

.post-container-even img, .post-container-odd img { height: 200px ; width: 380px ; display:block; clear: both}

.post-container-even .thumbnail, .post-container-odd .thumbnail { height: 200px ; width: 380px ;  }

也许放置一个<div style="clear:both"></div>每两个它可以解决，但这是非常蹩脚的？

感谢您的帮助

注意：

没有ie.css说明：Image

现在，ie.css：Image

Answer 1

谢谢，我解决了：

zoom: 1; *display:inline; in image containers.

在IE 7-9中，容器在第二个块之后开始重叠/收缩

1 个答案: