使用jquery选项卡在<ul>中创建文本中心</ul>

Question

我有<ul>标记，因为我有几个<li>项。当我将文本添加到列表项时。文字显示左侧。我想让它成为中心。我尝试了不同的方法来实现它。但仍然显示左侧。

 <ul>
      <li > <a href="#fragment-5" >
        <asp:LinkButton ID="lnkResources" runat="server" 
 CssClass="custom-tab"  Text="Favorites" 
 OnClientClick="jQuery('#tabs').tabs('select','#fragment-5');">
 </asp:LinkButton>           
            </a>></li>
    </ul>

见上图。它显示在选项卡的左侧。我想让它成为中心。

Answer 1

text-align不起作用吗？

li
{
    text-align:center;
}

这是一个基本的fiddle。

Answer 2

如果您将<li>视为已屏蔽元素，则应该能够居中对齐。如果你是漂浮它们并且它们是固定宽度的，那么这样的东西会起作用：

li { display: block; text-align: center; float: left; width: ...px; }

更好的是，将它们视为动态大小的内联块元素，并使用填充为中心：

li { display: inline-block; padding: 5px 25px 20px; ... }