Der Martin: Probleme mit nth-child

Beitrag lesen

Hallo,

Ich möchte eine grössere Anzahl von Boxen einblenden.
Jede Box sollte zu nächste einen Abstand von 10 Pixel haben,
jedoch sollte jede 4 Box keinen Abstand haben.

wie sieht das Markup (HTML) dazu aus? Ich vermute nämlich, dass du außer den schon genannten formalen Fehlern noch einen Denkfehler gemacht hast.

.box li {...}

Das trifft auf li-Elemente zu, die irgendwo innerhalb eines anderen Elements mit der Klasse "box" liegen. Beispiel:

<div class="box">  
 <h2>Jede Menge Boxen!</h2>  
 <ul>  
  <li>Erste Box</li>  
  <li>Zweite Box</li>  
  ...  
 </ul>  
</div>

Ist das denn so? Oder haben stattdessen die li-Elemente selbst die Klasse "box"? Dann wäre der Selektor falsch und müsste eigentlich li.box heißen - wobei man überlegen sollte, ob die Klasse nicht wirklich besser einem Vorfahrenelement zugeordnet werden sollte, etwa dem ul-Container. Das ist dann vernünftig, wenn sonst *alle* List Items dieselbe Klasse bekämen.

.box li:nth-child(3) {...}

Siehe oben. Je nachdem, wie dein Markup aussieht, müsste auch dieser Selektor möglicherweise li.box:nth-child(3) lauten.

Ciao,
 Martin

--
Es sagte...
ein korpulenter Lehrer zu einem Schüler, der ihn ein Fass genannt hatte: "Nein. Ein Fass ist von Reifen umgeben, ich dagegen von Unreifen."
Selfcode: fo:) ch:{ rl:| br:< n4:( ie:| mo:| va:) de:] zu:) fl:{ ss:) ls:µ js:(