我正在努力确定CSS /边距应在CSS的哪个位置保持父容器和子容器之间的分隔。例如，如果您有一个带有两个嵌套子级的父级div，并且两个子级之间的间距甚至为10px，并且子级与父级的间距为10 px；那么您是否将填充添加到父div {padding：10px}，然后在孩子之间添加10px的边距？还是您将父母留在0填充处，让孩子定义他们彼此之间以及父母之间需要什么分隔？
Here's the original fiddle showing both examples和显示相同内容的摘要
.parent1 { /*spaces itself from its children*/
display: inline-block;
padding: 10px;
font-size: 0;
border: 1px solid red;
}
.child1 {
display: inline-block;
margin-right: 10px;
font-size: 12pt;
border: 1px solid blue;
}
.child2 {
display: inline-block;
font-size: 12pt;
border: 1px solid green;
}
.parent2 { /*has not spacing from its children*/
display: inline-block;
font-size: 0;
border: 1px solid red;
}
.child3 {
display: inline-block;
margin: 10px;
font-size: 12pt;
border: 1px solid blue;
}
.child4 {
display: inline-block;
margin-right: 10px;
font-size: 12pt;
border: 1px solid green;
}<div class="parent1">
<div class="child1">child1</div>
<div class="child2">child2</div>
</div>
<br/>
<br/>
<div class="parent2">
<div class="child3">child3</div>
<div class="child4">child4</div>
</div>对我来说，这完全取决于所讨论节点的语义-父母是什么，孩子是什么？父级是否希望在其中保留空格以使其内容远离边框（填充）？还是孩子们“想要”他们与父母之间的距离（边缘）？这些问题的答案基于每个节点服务的目的（我对语义标记非常重视，避免使用呈现标记）[在您的情况下，在不知道进一步含义的情况下，听起来孩子们想从所有事物中得到10px，所以我会在各个方面给他们margin: 10px;。两个孩子之间的边距塌陷将只在其中留出10px的间隙，并且它们与周围的所有其他东西都将相距10px。
CSS边距属性位于外部，而填充在DIV块中。我不确定这是否是您想要的-记录在这里：
但是，如果在类中的位置是绝对的，则填充无关紧要。但如果您使用绝对头寸，则所有DIV都必须具有避免潜在冲突的绝对位置，您将拥有知道客户的最小屏幕尺寸（绝对不是一个好主意）。
注意：如果您的任何客户端仍在使用IE5，则该浏览器有一个应该在IE6中修复的填充错误。http://forums.devshed.com/css-help-116/css-padding-inside-absolute-div-70789.html
我通常在父容器上填充。然后是孩子之间的余地。例如，如果我有一个有10个li子代的ul，则向ul添加10px填充，为li添加10px边缘底部，为li添加0px边缘底部：last-of-type ...
大家好，我不是HTML专家，我是学习者，所以我从网络行业中学到了什么，所以我代表那位分享。
Paddings：-
Margins：-
如果要在子容器中使用边距，则不需要触摸父容器的宽度和高度，因为子容器将从所需区域开始。或查看更新的小提琴示例，我在子容器中使用了边距，因为当我在父容器中使用填充时，我调整了宽度和高度，但是当我使用边距时，不需要调整父容器，请参见演示： -http://jsfiddle.net/WSTv6/1/