回答
这不是问题,这是一个设计决定。这意味着:当相邻元素具有“接触”的边距时,这两个边距将折叠到相同的空间中。例如:
_____
| A | Element A has 20-px bottom margin
|___|
<-- space between elements is 20, not 40
_____
| B | Element B has 20-px top margin
|___|
边距“折叠”在一起。 CSS规范要求浏览器按照这种方式进行设计。一旦你了解何时以及如何发生,它实际上是一件好事并且很有帮助。
为什么这是件好事?我认为这就是最初的问题得到.. – Magne 2012-01-04 14:34:41
@Magne的原因是设计的可扩展性。当我们使用它来编写通用规则时,CSS的真正力量开始显示,这些通用规则应该如何显示某些*种*元素,而不知道这些元素将如何排列在特定页面上。边距的目的是在元素之间创建一个**装订线**。在设计规范中,通常情况下,排水沟应该精确(x)个像素 - 因此折叠可确保在不可预测的元素排列上设计合理的边距不会超过所需的排水沟尺寸。 – 2012-01-04 15:38:09
感谢您指出普遍性方面。我可以看到这是一件好事。我只是很烦恼,因为人们仍然需要精确地知道某个页面上的某些元素是如何排列的,因为边缘的折叠取决于附近的元素(即内嵌块vs块)。 – Magne 2012-01-04 17:22:01
- 1. 边缘崩溃与屁股
- 2. 当间隙存在时为什么边缘会崩溃?
- 3. 隐藏边缘具visibillity:崩溃
- 4. 如何`清除`防止边缘崩溃?
- 5. div div边缘崩溃问题
- 6. 什么是jsfiddle.net中的jQuery(边缘)?
- 7. 为什么边缘崩溃在这种情况下不会发生?
- 8. 这是为什么这边缘?
- 9. 边缘密度究竟是什么?
- 10. 这段代码为什么会崩溃
- 11. 这段代码为什么会崩溃?
- 12. Threejs边缘帮手
- 13. 边境崩溃
- 14. 字段集和边距崩溃
- 15. 链接边缘段
- 16. 这是为什么会崩溃? - C
- 17. 是什么让这个程序崩溃?
- 18. 是什么让谷歌搜索崩溃?
- 19. 是什么让WCF ServiceHost崩溃?
- 20. 什么是node.js内存崩溃?
- 21. Android - 手机边缘检测
- 22. 设置“visibility:hidden;”时,为什么Google Chrome中的表格单元格边框消失?和“边界崩溃:崩溃”?
- 23. 为什么textfield的边缘被剪切?
- 24. 为什么RSA_size会崩溃?
- 25. 为什么代码崩溃?
- 26. 为什么SDL_DisplayFormat崩溃?
- 27. 为什么程序崩溃?
- 28. enable_shared_from_this。为什么会崩溃?
- 29. 为什么rightBarButtonItem崩溃?
- 30. execv为什么会崩溃?
折叠边距是CSS Spec的一部分。 “问题”是什么意思? – 2010-06-30 02:24:10