Qual è il miglior modo semantico per mantenere allineati gli elementi dell'elenco orizzontale? - html, css, xhtml, css3

Qual è il miglior modo semantico per mantenere allineati gli elementi dell'elenco orizzontale?

È possibile mantenere allineati gli articoli al centro di questo codice

 <ul id="items">
<li>item 1</li>
<li>item2</li>
<li>iem3</li>
</ul>

li {list-style:none; font-size:16px; float:left; font-size:14px}

Ho trovato questo modo nella ricerca http://css-tricks.com/examples/CenterHorizontalListItems/

c'è qualche altro modo migliore? senza bisogno di extra div

C'è qualche trucco per scrivere qualcosa per questo ul li { } mantenere allineato il centro dell'elemento dell'elenco?

risposte:

Tutto quello che serve è display:inline o display:inline-block applicato al <li>s e text-align:center applicato al <ul> per ottenere il centraggio. Sicuramente non hai bisogno di extra markup non-semantico.

http://jsfiddle.net/Madmartigan/rKqMq/2/

Ci sono altri modi che coinvolgono float ma IMO in questo modo è il migliore. Nota che queste due proprietà di visualizzazione si comportano in modo diverso, quindi dovrai sintonizzarti per soddisfare le tue esigenze.