html - IE8/Compat View Bug - 所有图像在 Div 顶部相互堆叠。需要帮忙

Question

我在动物展示列表中处理的网站上发生了一个非常奇怪的行为。

动物以网格格式布置。当在 IE8 中并打开兼容模式时，动物图片全部拍摄到屏幕顶部并堆叠在彼此下方。

这让我很困惑。我需要呼吁这个社区的人才来帮助我修复这个错误。

示例页面在这里找到 - http://www.petango.com/Forms/AnimalSearchResults.aspx?z=L2R%205W3&d=2147483647&sh=0&s=1&b=650&g=All&size=All&c=All&a=All&dec=All&p=False&sid=0&zs=True&ht=False

在 IE8 中，它看起来不错，当打开兼容模式时，图像会拍摄到页面顶部。我只能假设在 IE7 中发现了这种行为。

我不知道从哪里开始解决这个问题。

更新 1 - 下午 12:16

我尝试了一个测试，我采用了动物显示代码并删除了无序列表并将其替换为表格。

LI 元素中的 Div 似乎不是罪魁祸首？

Answer 1

当然你需要清理你的标记而不是使用 <ul>和 <li>具有所有嵌套 <divs> 的结构当一个简单的 <table>会做得很好。

此外，您可以通过更改 div.center-photo-box-1 来靠近一点有 position:relative而不是 static .这会让你更接近...