为什么jQuery图标不能与文本对齐CSS属性对齐？

我使用一些jQuery UI图标作为表格中的列标题。跨度不基于文本对齐属性对齐，我无法找到合理的解决方法。为什么jQuery图标不能与文本对齐CSS属性对齐？

我试过使用CSS中的text-align属性和th的align属性，并且图标跨度不居中。相反，它保持左对齐。

HTML

<th align="center" scope="col" style="width:100px;"><a href="javascript:__doPostBack('RuleGrid','Sort$5')"><span class="ui-state-default ui-icon ui-icon-locked"></span></a></th>

CSS

th 
{ 
    text-align:center; 
}

我有一个jsFiddle描绘的问题。

来源

2012-04-04 Rondel

尝试text-align：center;在跨度本身 – 2012-04-04 21:41:08

@DavidBélanger跨度上的文本对齐中心也不起作用。我也尝试过 – Rondel 2012-04-05 13:43:09

这似乎只是在IE浏览器中的一个问题，铬和火狐渲染正确。您可以删除span标签，而只需将类放到标签上。我只是添加了样式“margin：0 auto”，它解决了IE中的问题。

干杯。

<th scope="col" align="center" style="width:100px;"> 
    <a href="javascript:__doPostBack('RuleGrid','Sort$5')" class="ui-state-default ui-icon ui-icon-locked" style="margin:0 auto"/> 
</th>

来源

2012-04-04 20:54:36

为什么jQuery图标不能与文本对齐CSS属性对齐？

回答

相关问题