嵌套Divs间距

Question

我有一个父div和两个嵌套的div。我将嵌套的div设置为display: table-cell。如何设置这些嵌套div之间的间距？我已经尝试了margin，但是没有做任何事情（jsFiddle设置了margin，但没有效果。）

jsFiddle showing my question/problem

Answer 1

提供display: inline-table;代替display: table-cell。像这样写

.child {
    width: 100px;
    height: 100px;
    display: inline-table;
    margin-left: 100px;
}

选中此http://jsfiddle.net/cZptA/9/

Answer 2

这应该可以解决你的问题。我假设您希望获得棋盘效果？

.child {
      float:left;
      width: 100px;
      height: 100px;
      display: inline-block;
      margin-left: 100px;
    }

Answer 3

代替display: table-cell，试试这个：

.child {
    width: 100px;
    height: 100px;
    float:left;
    margin-left: 100px;
}

Answer 4

可能非常简单

由于您已将子div指定为表格单元格，因此默认情况下它们之间没有间距，就像常规表格一样。 因此，您的代码没有任何问题。

如果您真的希望divs表现为表格。您的父div应该border-spacing表示table-cells。

之间的间距

.parent {
    width: 400px;
    height: 400px;
    background-color: red;
    border-spacing: 10px;
}

Demo