使 <ul><li> 列表居中对齐答案

【问题标题】：Making <ul><li> list align center使 <ul><li> 列表居中对齐
【发布时间】：2014-03-06 18:28:50
【问题描述】：

我将动态类“float-left”、“float-right”和“float-center”应用到列表中，以便将它们正确放置在我想要的位置，但由于没有 float:center; 用于居中；我尝试了边距，内联块； text-align:center.. 但没有任何效果.. 请检查这个小提琴

 ul.tabs .center {
   margin:0 auto;
   text-align:center;
   overflow:hidden;
 }

 .float-center li{
   display:inline-block;
 }

http://jsfiddle.net/443E2/

【问题讨论】：

看这里：stackoverflow.com/questions/1740587/float-a-div-to-center

标签： css

【解决方案1】：

使用以下代码：

.float-center {
    text-align: center;
}
.tabs.float-center li {
    display: inline-block;
    float; none;
    margin-left: -4px;  /* Fix for white spaces between li while using inline-block */
}
.tabs.float-center li:last-child {
    border-right: 1px solid #999;
}

查看更新jsfiddler

【讨论】：

【解决方案2】：

检查这个分叉 - http://jsfiddle.net/GzS7X/

我将其更改为将 <li> 的内容居中：

.tab_content {
    padding: 20px;
    font-size: 1.2em;
    text-align:center;
}

【讨论】：

同理，内容居中，但 LI 本身左对齐。我希望标签按钮居中对齐。