Question

我正在使用Zurb Foundation 5，但我遇到了一个有点奇怪的问题。因为我想为两列使用不同的背景颜色和边框，我需要在它们之间留出空间。我在底部包含了jsfiddle，但首先是代码：

<div class="row">
    <div class="small-9 columns content">
        The custom CSS is at the bottom of the CSS window.
    </div>
    <div class="small-3 columns sidebar">
        Edit it to see that the paddings change!
    </div>
</div>

<div class="divider"><p>Space</p></div>

<div class="row">
    <div class="small-8 offset-1 columns content">
        The custom CSS is at the bottom of the CSS window.
    </div>
    <div class="small-3 columns sidebar">
        Edit it to see that the paddings change!
    </div>
</div>

在第二行中，我使用了“offset”函数，但它给了我列之间太多的空间。我只需要一些标准的10到20像素。

有没有人知道如何使用foundation5来管理它？我希望在这两列之间有一个静态边距。

http://jsfiddle.net/pXVR3/19/

高度问候，

乔治

Answer 1

我在这个帖子中找到了答案： How to add white space between two divs of 6 columns each in foundation 4?

您只需在div中使用包含网格信息的额外div，如下所示：

  <div class="row">
       <div class="small-12 medium-8 columns"><div class="content"></div></div>
       <div class="small-12 medium-4 columns"><div class="sidebar"></div></div>
  </div>

现在你只需将背景颜色应用于网格div，将填充应用于内部div。

感谢。

如何在不使用偏移量的情况下在两列之间的Foundation5网格中添加边距？

1 个答案: