Каков наилучший семантический способ выравнивания горизонтальных элементов списка по центру?

Question

Каков наилучший семантический способ выравнивания горизонтальных элементов списка по центру?

Можно ли сохранить центр элементов выровненным по этому коду

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

Я нашел этот способ в поиске http://css -tricks.com / examples / CenterHorizontListItems /

Есть ли другой способ лучше? без необходимости дополнительных div

Есть ли какой-нибудь трюк, чтобы написать что-то для этого ul li { }, чтобы держать центр списка по центру?

Answer 1

Все, что вам нужно, это display:inline или display:inline-block, примененные к <li> s, и text-align:center, примененные к <ul>, чтобы получить центрирование.Вам определенно не нужна дополнительная несемантическая разметка.

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

Есть и другие способы, которые включают в себя float, но IMO этот способ лучше.Обратите внимание, что эти два свойства отображения ведут себя по-разному, поэтому вам придется настраиваться в соответствии с вашими потребностями.