设置 div 之间的空间

Question

我有两个这样的div：

 <section id="main">
  <div id="left">
    <asp:ContentPlaceHolder ID="left" runat="server" />
  </div>
  <div id="right">
    <asp:ContentPlaceHolder ID="right" runat="server" />
  </div>
</section>

这是我的CSS：

 #left {
  float: left;
  margin-right: 17px;
}

#right {
  float: right;
}

我希望 div 之间的空间是 40px 。我尝试在我的 css 中添加填充、边距和宽度，但我认为它没有将填充设置为正确 40px 。怎么做？

原文由 petko_stankoski 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

以相同的方式浮动它们并添加 40px 的边距。如果您有 2 个元素以相反的方式浮动，您将拥有更少的控制权，并且包含元素将确定它们之间的距离。

 #left{
    float: left;
    margin-right: 40px;
}
#right{
   float: left;
}

原文由 benni_mac_b 发布，翻译遵循 CC BY-SA 3.0 许可协议

Answer 2

对于寻找在 N div 之间设置间距的解决方案的人们，这是使用伪选择器的另一种方法：

 div:not(:last-child) {
  margin-right: 40px;
}

您还可以组合子伪选择器：

 div:not(:first-child):not(:last-child) {
  margin-left: 20px;
  margin-right: 20px;
}

原文由 David Salamon 发布，翻译遵循 CC BY-SA 3.0 许可协议