如何解决IE 8错误定位960网格
我有下面的HTML和类结构。它在Firefox中按预期显示,但在IE 8中,“ 0”被推送到下一行。有什么想法可能有问题吗?<!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%;
}
,@clairesuzy我认为问题在于所应用的样式。有一些样式在主div或rt-col和lt-col div中添加了填充
可以使用以下代码轻松将其排序
<div class=\"container_12\">
<div class=\"grid_8\">
...
</div>
<div class=\"grid_4\">
...
</div>
<div class=\"clear\"></div>
</div>
不论样式如何,以上内容均可立即使用...
然后执行此操作,并确保没有填充
<div id=\"main\">
<div class=\"container_12\">
<div class=\"grid_8\">
<div id=\"lt-col\">...</div>
</div>
<div class=\"grid_4\">
<div id=\"rt-col\">...</div>
</div>
<div class=\"clear\"></div>
</div>
</div>
您想做什么的简化版
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。