nth-child (3n)

[Gunnar Bittersmann]

@@Martin_Online:

nuqneH

<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>

  
Die alt-Texte sind eher sinnlos. Oder findest du sie für Screenreader-Nutzer hilfreich?  
  
  

> Mein `:nth-child(3n)`{:.language-css} soll nur innerhalb von "small-features" zählen, so wie es aussieht, zählt `:nth-child(3n)`{:.language-css} ab dem großen Bild, sprich dem Bild darüber, die Frage ist warum?  
  
Nein, so zählt `:nth-child()`{:.language-css} nicht. Es zählt die Geschwisterelemente innerhalb von section.small-features, und zwar unabhängig von deren Typ! Das erste dieser Elemente ist also das h3-Element (was du aber nicht selektierst, wenn du `img:nth-child()`{:.language-css} angibst.  
  
Wenn du nur die img-Geschwisterelemente durchzählen lassen willst, ist `img:nth-of-type()`{:.language-css} dein Freund.  
  
BTW, `section.small-features img`{:.language-css} ist überspezifiziert, `.small-features img`{:.language-css} sollte genügen.  
  
Qapla'

-- 
„Talente finden Lösungen, Genies entdecken Probleme.“ (Hans Krailsheimer)