Html 将CSS填充/边距添加到Divs

我试图放置一个

填充：16px 0到3个div浮动到彼此的左侧，但我在如何操作上有困难

示例：

边框底部：中红色重瓣应该在第一节小部件下方16px

为什么这不起作用？有没有一种方法可以做到这一点而不针对特定的div ID，例如#search、#logo、#social等，因为以后可能会放置更多的小部件

谢谢。

#section-one:after {
  content: "";
  clear: both;
  display: block;
}

由于所有三个内部div都是浮动的，因此它们将从布局中删除，而容器div的高度仅为16像素。在那里添加一个clear使它能够像您期望的那样工作。类似于由大量重置样式表实现的clearfix

[编辑，因为我们不喜欢仅链接的答案]

HTML


由于所有三个内部div都是浮动的，因此它们将从布局中删除，而容器div的高度仅为16像素。在那里添加一个clear使它能够像您期望的那样工作。类似于由大量重置样式表实现的clearfix

[编辑，因为我们不喜欢仅链接的答案]

HTML

1.到底怎么了？在您的示例中，确实有填充。2.使用一个类（例如
.sections
）1。底边：中重瓣红色；应在第一节小部件下方16px。2.第一节：widgets1。到底怎么了？在您的示例中，确实有填充。2.使用一个类（例如
.sections
）1。底边：中重瓣红色；应在第一节小部件下方16px。2.第一节widgetsthank@idrumgood的快速响应。我没有意识到这是在浮动div时发生的+1感谢您提供的额外见解。感谢@idrumgood的快速响应。我没有意识到这是在浮动div时发生的+1表示额外的洞察力。非常好，而且我不必在HTML中创建额外的div，+1。非常好，而且我不必在HTML中创建额外的div，+1。
<div id="section-one">
    ...
    <div class="clr"></div>
</div> <!--end #section-one-->

.clr {
  clear:both; 
}