Martin_Online: nth-child (3n)

Beitrag lesen

Dann prüfe mal, wo die Zählung beginnt. Das mittlere Bild folgt der Regel padding-right: 0;. Somit ist klar, dass die Regel grundsätzlich greift. Die Zählung beginnt nur an der für dich falschen Stelle. Wenn wir davon ausgehen, dass der Browser das richtig macht – denn sonst schlügst nicht nur du hier mit dem Problem auf –, steht dir ein Verständnisproblem mit der Zählung im Weg.

Wenn ich mir das genau ansehe, dann beginnt der Browser mit dem großen Titel Bild. Das ist aber falsch bzw. ich verstehe es falsch. Mein HTML Code sieht derzeit so aus

  
        <section class="feature-rotator">  
            <h3>Feature Rotator</h3>  
            <img src="http://placehold.it/900x300" alt="Slider">  
        </section>  
  
        <section class="small-features">  
            <h3>Small Features</h3>  
            <img src="http://placehold.it/292x263" alt="Werbung 1">  
            <img src="http://placehold.it/292x263" alt="Werbung 2">  
            <img src="http://placehold.it/292x263" alt="Werbung 3">  
            <img src="http://placehold.it/292x263" alt="Werbung 1">  
            <img src="http://placehold.it/292x263" alt="Werbung 2">  
            <img src="http://placehold.it/292x263" alt="Werbung 3">  
        </section>  

mein CSS so:

  
section.feature-rotator img {  
	max-width:100%;  
	height:auto;  
}  
  
section.small-features img {  
	width:auto;  
	height:auto;  
	padding-right:0.4%;  
	margin-top:2%;  
}  
  
section.small-features img:nth-child(3n) {  
	padding-right:0px;  
}  

Mein :nth-child(3n) soll nur innerhalb von "small-features" zählen, so wie es aussieht, zählt :nth-child(3n) ab dem großen Bild, sprich dem Bild darüber, die Frage ist warum?