具有不同边距的CSS nth Div

Question

我希望每个第二个div都有margin-right=0, border-right=0...。我尝试用css但没有工作

我正在外部div rptAlbums-wrapper中包装相册，然后将个别相册图像＆amp;另一个div uc-album-wrapper中的标题。

我尝试了.rptAlbums-wrapper .uc-album-wrapper :nth-child(2n+1)，但这不起作用

我还设置了小提琴example

<div class="rptAlbums-wrapper">
    <div class="uc-album-wrapper">
        <div class="uc-album-icon">
            <img alt="Album One" src="../../../../images/gallery/b9415c69-98c8-417a-960f-2adf2148c83f.jpg" class="uc-album-img" title="Album One" id="ContentPlaceHolder1_ucPhotoGallery_rptAlbums_imgAlbumIcon_0">
        </div>
        <div class="uc-album-name"><span id="ContentPlaceHolder1_ucPhotoGallery_rptAlbums_lblAlbumName_0">Album One</span>
        </div>
    </div>
    <div class="uc-album-wrapper">
        <div class="uc-album-icon">
            <img alt="Album Two" src="../../../../images/gallery/fb1facf3-579e-4e5d-9ed8-b7f231d50f88.jpg" class="uc-album-img" title="Album Two" id="ContentPlaceHolder1_ucPhotoGallery_rptAlbums_imgAlbumIcon_1">
        </div>
        <div class="uc-album-name"><span id="ContentPlaceHolder1_ucPhotoGallery_rptAlbums_lblAlbumName_1">Album Two</span>
        </div>
    </div>
</div>

更新演示如何实现

Answer 1

你快到了。您需要在元素本身上使用:nth-child()选择器。

.rptAlbums-wrapper .uc-album-wrapper:nth-child(2n) {
    background-color:Red;
    border-right:0px solid #ccc;
    margin-right:0px;
}

jsFiddle Demo

Answer 2

伪类，检查出来：

http://www.w3schools.com/css/css_pseudo_classes.asp

.mydiv:nth-child(2) { margin-right: 5px; }

Answer 3

你只需要删除行.rptAlbums-wrapper .uc-album-wrapper :nth-child(2n+1)中冒号之前的空格（js小提琴示例中css的第15行）。

Answer 4

我只是为了清楚自己清理了HTML，删除了.rptAlbums-wrapper .uc-album-wrapper :nth-child(2n+1)中的空格，现在它正在运行......

http://jsfiddle.net/mahish/ZyjwF/10/