• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

Benötige Hilfe bei Odd and Even (css selektoren)

lddd

Neues Mitglied
Hallo,

ich habe folgendes Problem. Innerhalb meines "News" Container "news-item-holder" möchte ich abwechselnd jeden 2. "news-item-container" den Hintergrund für "news-item-headline" ändern. Also quasi das jede 2. News Box als Überschrift eine andere Hintergrund Farbe erhält.

Irgendwie bekomm ich das nicht ganz hin. Meine Struktur ist wie folgt:

Code:
   <!-- News Container start -->
        <div class="news-holder clearfix">
            <!-- News Item start -->
            <div class="news-item">
                <div class="news-item-img">
                <img src="/img/mrket.jpg" height="54" width="81"></div>
                <div class="news-item-text">
                    <div class="news-item-head">
                    <h1>MRKET</h1>
                    </div>
                    <div class="news-item-date">
                    <h2>17.01.2011 - 19.01.2011</h2>
                    </div>
                    <div class="news-item-loc">
                    <h3>New York, USA</h3>
                    </div>
                </div>
            <!-- News Item end -->
</div>
<!-- News Container end -->
</div>
Dann versuche ich jeden 2. "news-item-head" Layer den Hintergrund rot zu setzen

Code:
div.news-item-head:nth-child(2) {
  background: red;
}
Funktioniert nur irgendwie nicht so...
 
Es gibt pro .news-item nur jeweils ein Child .news-item-head. Du musst da vom Rahmenelement ausgehen. Etwa so:

Code:
div.news-holder div.news-item:nth-child(2n) div.news-item-head {
  background: red;
}

Treffe jedes zweite div-Element mit Klasse .news-item in div.news-holder. Setze dort den Hintergrund für die .news-item-head-Klasse.
 
Zurück
Oben