浮动 div 在 IE9 中未正确对齐

Question

我在 IE9 中遇到了浮动 div 的问题。第二个 div（在添加了边框之后）似乎被分成了两部分，尽管它是一个带有标题标签和无序列表的 div。标题标签正确显示，而列表被推到第一个 div 下方，其他 div 然后浮动在列表旁边。如果我删除了包含列表的 div，下一个 div 也会发生同样的事情；标题显示正确，但图像被推到第一个 div 下方。看看这个网站：http://www.greenhomesofmaine.com/ 向下滚动到页脚。 IE9 是唯一导致这种 div 对齐错误的浏览器。

CSS：

#footertopbg {
display: block;
background: #333333;
width: 980px;
margin: 10px auto 0px;
padding: 0px 0px 0px 0px;
border-top: 5px solid #222222;
}

#footertop {
float: left;
display: block;
line-height: 16px;
background: #333333;
width: 980px;
margin: 0px 0px 0px 0px;
padding: 0px 0px 0px 0px;
}

#footertop h4 {
color: #FFFFFF;
font-size: 16px;
font-family: Arial, Helvetica, sans-serif;
font-weight: bold;
text-transform: normal;
letter-spacing: -0.2px;
margin: 0px 0px 10px 0px;
padding: 20px 0px 5px 0px;
text-decoration: none;
border-bottom: none;
}

#footertop li {
text-decoration: none;
list-style-type: none;
}

#footertop li a, #footertop li a:link, #footertop li a:visited {
color: #CCCCCC;
font-weight: normal;
text-decoration: none;
}

#footertop ul {
list-style-type: none;
margin: 0px;
padding: 0px 0px 10px 0px;
}

#footertop ul ul {
list-style-type: none;
margin: 0px;
padding: 0px;
}

#footertop ul li {
list-style-type: none;
margin: 0px 0px 8px 0px;
padding: 0px;
}

#footertop ul li {
display: inline;
list-style-type: none;
margin: 0px 0px 0px 0px;
padding: 0px;
}

#footertop ul li a {
background: none;
display: block;
padding: 5px 7px 3px 7px;
margin: 0px 0px 8px 0px;
border-left: 5px solid #333333;
}

#footertop ul li a:hover {
background: none;
color: #FFFFFF;
display: block;
padding: 5px 7px 3px 7px;
border-left: 5px solid #0099CC;
}

#footertop .textwidget {
color: #CCCCCC;
line-height: 18px;
}

.footertopleft {
width: 170px;
float: left;
display: inline;
margin: 0px 10px 0px 15px;
padding: 0px 0px 0px 0px;
}

.footertopmidleft {
width: 170px;
float: left;
display: inline;
margin: 0px 10px 0px 10px;
padding: 0px 0px 0px 0px;
}

.footertopmid {
width: 170px;
float: left;
display: inline;
margin: 0px 10px 0px 10px;
padding: 0px 0px 0px 0px;
}

.footertopmidright {
width: 170px;
float: left;
display: inline;
margin: 0px 10px 0px 10px;
padding: 0px 0px 0px 0px;
}

.footertopright {
width: 170px;
float: right;
display: inline;
margin: 0px 15px 0px 10px;
padding: 0px 0px 0px 0px;
}

我从未遇到过这样的问题，我们将不胜感激。

Answer 1

尝试在兼容模式下使用 IE9。无论出于何种原因，都有该选项，而且很多时候这是解决仅与 IE9 相关的愚蠢问题的唯一方法。