jquery:n-child（）将不需要的边距添加到子节点

我正在尝试使用很棒的jquery插件->

该插件工作得很好，但是我在创建布局时遇到了问题，在布局中，我使用了一个n-child（）选择器来消除每三个元素上的空白

#footerwidgets li.widget {
    margin: 0px 24px 24px 0px;
    width:340px;
}

#footerwidgets li.widget:nth-child(3n) {
  margin-right:0px;
}

因为我这个小部件的容器正好是1068px宽，所以三个小部件非常适合（因为最后一个小部件没有右边距）

当我尝试使用jquery砌体插件时，这种行为会被忽略！只有两列可以放进去。（插件可以工作，所以所有的小部件都以砖石风格浮动。）当我检查元素时，每三个元素都有一个24px的右边距。所以第n个孩子被忽略了

---

有什么办法可以让它发挥作用吗？

对于可变大小的边距，砖石结构不起作用。您有三个列和一个528px的容器。最好的选择是使用三列176px。每列的边距为12px，宽度为152px

---

如果希望总宽度减去左右边距为528px，则将容器扩展到544px（528px+2 x 12px），列宽度扩展到160。

使用jQuery，删除边距并在其位置使用

CSS:

jQuery：

$('#footerwidgets').masonry({
  gutterWidth: 24
});

---

你在哪个浏览器中测试这个？第n个子选择器是css3，因此支持仍然有点有限。Internet Explorer直到第9版才支持它。我使用的是chrome和/或Safariry，逗号不是问题，这只是发布此问题时发生的一个小错误。。。问题是我需要三个小部件水平地装入我的#wrapper div（1068px宽）。每个小部件的宽度为340px，右边距为24px。每三个小部件的右边距设置为0；这意味着340+24+340+24+340=1068。当我不使用砖石时，这很好用。然而，当我使用砌体时，所有小部件都有一个24px的右边距，因此每三个元素也会向左浮动->因此只有两列小部件适合我的包装器。是的，您正确地理解了我。我的第三个小部件是向左浮动的。但是，我希望它除了其他两个小部件之外，向右浮动到顶部。你能发布一个链接到你的HTML吗？这将帮助我更好地回答你的问题。使用类似PasteBin的东西这是我的问题：取消对javascript行的注释并查看。事实上，三根柱子可以装进去，但是用砖石砌成的只有两根。

$('#footerwidgets').masonry({
  gutterWidth: 24
});