适应容器宽度的项目

5
我有一个容器里面放了10个元素,每个元素都有右边的margin。我用jQuery去掉了每个第五个元素的margin,但是因为容器的宽度和元素的宽度都是百分比,所以当我缩小或者放大屏幕时,元素不会延伸到容器的末端。我该怎么办? 这里是Fiddle
1个回答

5

只需将右边距设置为百分比。

div总宽度为16% x 5 = 总宽度的80%。因此,剩余宽度为20%。将其除以5(总div边距)并设置为4%:

margin-right:4%;

请查看演示

此外,在这里不需要使用jquery来将margin-right: 0应用于第五个元素。您可以使用以下CSS:

li:nth-child(5n){
    margin-right: 0px;
}

是的,我知道CSS中的nth-child选择器,但我正在尝试为所有浏览器做到像IE8一样。 - aiddev
@user3090189 只是一个建议:你仍然可以在 CSS 中这样做:li:first-child + li + li + li + li(选择第五个元素)。 - Mr_Green
感谢Mr_Green的建议。 - aiddev

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接