css - n番目の子セレクター

Question

このページでは、各アーティストの写真を左と右に交互に回転させたいと思います。これを行うために使用しているセレクターは

.artistsList img:nth-child(2n+1) {
    -moz-transform: rotate(-4deg);
}

.artistsList img:nth-child(2n) {
    -moz-transform: rotate(4deg);
}

しかし、何らかの理由で、最初のルールがすべての画像に適用されているため、すべての画像が左に回転します。

Answer 1

これは、HTML 構造が原因です。すべてのイメージは、その親の最初の子です。これらのセレクターは、より適切に機能するはずです。

.artistsList div.artistEntry:nth-child(odd) img { ... }
.artistsList div.artistEntry:nth-child(even) img { ... }