在某些浏览器中应用 css 代码的样式时发生了一些奇怪的事情......
请看一下示例... http://jsfiddle.net/3FepW/3/
在 Chrome 中，绿色 div 比在 Firefox 中更大，我真的不知道是什么问题，我认为在 Firefox 中它应该显示，但在 Chrome 和 IE9 中显示不同。我尝试了很多更改，几天都无法解决这个问题..，我可以使用height: 100% 或 overflow hidden 但我不能使用其中一个，因为：overflow hidden 隐藏里面的所有内容，但我有一些可拖动/可排序元素和高度：100%，因为我有一个可调整大小的函数，可以放大黄色 div...
问题来自称为边距折叠的东西。Chrome 和 IE 正在正确呈现它。不确定 Firefox 在做什么。
这里有很多关于同一个问题的问题。我在这里回答了其中一个问题 -在 HTML5 网页中添加 CSS 边框更改定位
基本上是兄弟姐妹之间的顶部和底部边距，孩子和父母折叠到他们中的最高点。float: left你穿上的可以.c1防止这种情况发生。margin-bottomon卡.c3在里面.c1，这就是它变大的原因（即，“这就是.c1变大的原因”）。
尝试添加overflow: auto;-.c2另一种防止边距折叠的方法 - 所以c1' 边距被“卡住” .c2- 我假设这可能是你正在寻找的。
这是一个小提琴-> http://jsfiddle.net/joplomacedo/3FepW/5/。
删除margin-bottom: 10px;from .c3- 这就是导致这种行为的原因。据我所知，此类问题通常被称为“可折叠边距”，如果我错了，请有人纠正我。