Fuegt man den LI-Elementen jedoch noch eine Border hinzu,
so wirkt sich das auf die gesamte Breite aus, so dass sich
das dritte Element in die neue Zeile verschiebt.
funktioniert so wie es soll
die breiter der box = margin + border + padding + width
mit deiner rechnung hast du also 33% + 33% + 34% + 6x einen rahmen von X breite, das sind auf jeden fall mehr als 100%
Ich dachte, Prozentangaben waeren genau fuer so etwas geeignet?
wenn du einen absoluten rand (1px) haben willst nein - da bleibt dir nur ein zusätzliches element im <li /> über mit welchem du dann den rand erzeugst (1px solid black) - damit umgehst du diesen schönheitsfehler
mit einem relativen rand wäre es kein problem - aber einen 1%-dicken rahmen auf jeder seite zu haben sieht wahrscheinlich blöd aus
in manchen fällen gibts leider kleine tücken, die man über umwege lösen muss, aber allgemein ist es wesentlich verständlicher
die klassen item1 bis x sowie even/odd bräuchte man ansich auch nicht, dafür gibst die pseudoklasse :nth-child
[http://www.w3.org/TR/2001/CR-css3-selectors-20011113/#nth-child-pseudo]
auch die klasse .last-child von mir ist eine verlegenheitslösung - die gibts ebenfalls schon als :last-child
aber 3x darfst du raten, woran es scheitert ;)