html - 无法将 Li 置于 Ul 的中心

Question

.container                          {width: 1280px;min-height: 100%;margin: 0 auto;border: 1px solid #fff;}
.nav-icon                           {display: block;margin-left: auto;margin-right: auto;}

.navigation                         {text-align: center;}
.bans                               {background: url('http://i.imgur.com/iAUP7gR.png');width: 156px;height: 85px;float: left;display:inline-block;margin-left: 21px;margin-right: 21px;}
.shop                               {background: url('http://i.imgur.com/4x7gr4h.png');width: 155px;height: 85px;float: left;display:inline-block;margin-left: 21px;margin-right: 21px;}
.vote                               {background: url('http://i.imgur.com/WPZnkFV.png');width: 160px;height: 59px;float: left;display:inline-block;margin-left: 21px;margin-right: 21px;margin-top: 11px;}
.leaderboard                        {background: url('http://i.imgur.com/ygQlMaN.png');width: 394px;height: 85px;float: left;display:inline-block;margin-left: 21px;margin-right: 21px;}

我用它来尝试将多个 Li 置于 Ul 的中心...

<ul>
    <li><a href=""><div class="bans"></div></a></li>
    <li><a href=""><div class="shop"></div></a></li>
    <li><a href=""><div class="vote"></div></a></li>
    <li><a href=""><div class="leaderboard"></div></a></li>
</ul>

Answer 1

基于 nicole101 的回答:

CSS
.navigation{
text-align: center;
}
HTML
<div class='navigation'>
<ul>
    <li><a href=""><div class="bans"></div></a></li>
    <li><a href=""><div class="shop"></div></a></li>
    <li><a href=""><div class="vote"></div></a></li>
    <li><a href=""><div class="leaderboard"></div></a></li>
</ul>
</div>

然后会居中