我有一个 320 像素宽的 div。我在左侧 float 列表项,每个项的宽度为 100 像素。然后我想在每个列表项的右边留出 10px 的右边距。所有其他边距和填充均已删除。
所以,在进入下一行之前,我基本上希望每行有 3 个列表项。但是因为在第 3 个元素(即所有元素)上有一个 margin-right,它会转到下一行(所以每行只有 2 个元素)。
有没有办法在这种情况下每行有 3 个元素,而无需创建额外的类或使用脚本。
最佳答案
使用 CSS3 selectors :
ul:nth-child(3n) { margin-left: 0px; ... }
ul:nth-child(3n+1) { margin-left: 10px; ... }
ul:nth-child(3n+2) { margin-left: 10px; ... }
由于缺少 CSS3 支持,可能不实用。
关于html - CSS 中的 float 列表边距,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/1107289/