2007-7-2 上午 - HTML/CSS/XML/XSL - -   

div.container {
	border: 1px solid #000000;
}
div.left {
	width: 45%;
	float: left;
}
div.right {
	width: 45%;
	float: right;
}

层套关系：container 的 div 包含 left 和 right

最简单的清除浮动的方法：

div.container {
	border: 1px solid #000000;
	overflow: hidden;
	width: 100%;
}

兼容情况：IE6 IE7 FF MacIE 等

来源地址：http://www.quirksmode.org/css/clearing.html

这篇文章发表2007年7月2日 上午 10:16，并被分类于HTML/CSS/XML/XSL，已被 25015 人阅读。 您可以通过订阅 RSS 2.0 跟踪对这篇文章的评论， 也可以发表您的评论，或者在您自己的网站中 引用（trackback） 该篇日志。

  • 暂无相关日志


共有4 条评论

  1. 1. 头像 coocboy 2008年9月17日 下午 2:23 ₪

    width: 100%;
    好像width是一个固定值,则clear无效

  2. 2. 头像 汤海龙 2008年12月30日 上午 10:24 ₪

    楼上用的什么浏览器啊！

  3. 3. 头像 midychen 2009年3月31日 上午 11:32 ₪

    我通常的解决方法，不过zoom通不过w3c标准。
    div.container {
    border: 1px solid #000000;
    overflow: hidden;
    _zoom:1;
    }

  4. 4. 头像 Mask 2009年5月6日 下午 5:53 ₪

    关于清除浮动，如果你需要验证xhtml和css的validator，用after加ie下zoom的方法个人觉得比较麻烦，overflow:hidden的使用给我们增加了一个简洁的选择，不过我发现的在两种情况下是不能用的。1，就是有最小高度的情况下，用了overflow:hidden就不可能有最小高度了，2，就是p上用，这样会导致文字的选择只能限制在p里

发表评论

(必填)

(必填，会为您保密)

评论仅支持“a、abbr、strong、em、blockquote、code”几个简单的标签