css - 为什么子div的边距会影响父div的边距?

标签 css jquery formatting

请引用http://jsfiddle.net/NobleWolf/X6qVv/ .

我有三个 div,它们通过 jquery 设置为窗口高度,它们有一个下边距,它们被称为“.pannel”。每个“.pannel”内部都有一个名为“.pContent”的子项,它具有顶部填充。

我的问题是为什么“.pContent”在“padding-top: 3%;”时会改变父级的上边距更改为“margin-top: 3%;”

谢谢!

最佳答案

这是由于collapsing margins - 如果没有边框、填充、间隙或行框分隔 block 级元素,则 block 级元素的上边距将始终与其第一个流入 block 级子元素的上边距折叠。防止这种行为的一种方法是将每个包含 div 的显示值更改为 inline-block:

http://jsfiddle.net/X6qVv/4/

关于css - 为什么子div的边距会影响父div的边距?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/17137262/

相关文章:

Excel,链接2个单元格以具有相同的格式

javascript - 如何在javascript中隐藏单个div的段落

ajax - Ajax加载后重新加载Cufon,请帮忙

python - 字符串格式问题以及将字符串与数字连接

Javascript 设置对象选项

jquery - 如何结合我的 jQuery

compiler-errors - Mathematica : 'Findroot' not returning expected result

javascript - 如何在 HTML/CSS 中创建闭式文本?

html - 如何水平对齐显示:inline-block

javascript - 将元素放在用户点击的位置