我有下面的 html 和类结构。它在 Firefox 中按预期显示,但在 IE 8 中,rt-col
被推送到下一行。关于可能出错的任何想法?
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
...
...
<div id="main" class="container_12">
<div id="lt-col" class="grid_8">
...
</div>
<div id="rt-col" class="grid_4">
...
</div>
</div>
与容器和网格相关的 CSS 如下:
#main:after, #lt-col:after, #rt-col:after {
content: ".";
height: 0;
visibility: hidden;
display: block;
clear: both;
}
#main {
width: 960px;
margin-left: auto;
margin-right: auto;
margin-top: 10px;
}
最佳答案
假设您正在尝试构建左右列网格:
您需要为每一列定义明确的宽度。目前,你没有。并且由于您使用的是“clear: both;”属性和值,它们将简单地显示为行。
将此添加到您的 CSS(或宽度的一些变化),您的行将变成列:
#lt-col {
float: left;
width: 50%;
}
#rt-col {
float: right;
width: 50%;
}
关于html - IE 8 错误定位 960 网格,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/5426213/