Что использовать вместо тега center в HTML5?

Question

[ZzZero]

Моя ситуация:
HTML&CSS код

<ul>
  <li><div></div></li>
  <li><div></div></li>
  <li><div></div></li>
  .......
</ul>

ul{
  list-style: none;
  margin-top: 20px;
}
li{
  display: inline-block;
  margin-right: 20px;
  margin-bottom: 15px;
  width: 220px;
}

Обычно это делается так:
ul{margin: 0 auto; width: 500px}
Но, дело в том, что для ul нельзя задать ширину, потому-что количество li в одной строке зависит от доступной ширины.
Так как тогда выравнять по центру, если в 1 строку вместилось 3 тега li, но свободное пространство ещё есть?

Временная ссылка на вёрстку:
jsfiddle.net/vAmCT

Answer 1

[_ _]

это имели в виду?
jsfiddle.net/AMar4enko/5ePMn

Comments

[ZzZero]

Нет, в вашем примере последний li тоже центруется, он должен быть слева. Желтым пометил, куда должен сместится тег li https://www.dropbox.com/s/5ni6t9w7uf3tgb6/%D0%A1%D...

[ZzZero]

т.е. например ширина сайта 900px, ширина li - 230px. 4 тега li в одну строку не вместятся (230*4 = 920), влезают 3 - 690px, тогда мы имеем свободной пространство 210px. я хочу отцентровать весь блок ul, целиком, чтобы слева и справа от него было пространство в 105px. В вашем примере ul вроде центрируется, но нежелательный эффект - последний тег li тоже центрируется.

[trall]

@ZzZero У меня ваш пример и пример @AMar4enko работает одинаково. И точно также, как вы описали

[ZzZero]

@sashablashenkov мой пример, это не то, как должно работать, это то, как мне не нравится) да, эти примеры совпадают.