Question

我正在使用Tablesorter Jquery插件对表进行排序，但样式表中指定的图像背景图像落在列的文本后面，其中列的实际内容不足以推动列宽超出标题文本的长度。

例如，请转到此处：http://tablesorter.com/docs/然后缩小浏览器，直到向上/向下箭头位于Age列的文本后面。我发生了类似的事情。

我可以硬编码列的宽度足够宽，但我宁愿在CSS文件中有一个更可重用的解决方案。

所以有人知道如何为a指定某个“填充”。 Padding-right和margin-right似乎没有任何影响。

Answer 1

使用以下CSS：

thead th
{
    padding-right: 20px;
}

这可以通过创建图像所在的“空白”空间来解决问题。

Answer 2

这就是你现在的细胞：

<th class="header">Last Name</th>

背景图片在类标题中设置，因此您可以订购asc或desc

我想唯一的解决办法是尝试这样的事情

<th class="header">
<div style="margin-right: 10px;">Last Name</div>
</th>

以这种方式，您的图像将始终位于标题的右侧希望这有帮助

Answer 3

或者只是将其添加到您的css：

th.header {
    padding-right: 20px;
}

Answer 4

我知道这是一个古老的问题，但是当我遇到同样的问题并发现填充或边距没有帮助时，我遇到了它。

Tablesorter为你在标题中添加一个div，你可以在div中添加margin-right来解决问题。

tablesorter使标题看起来像这样：

<th data-column="2" class="tablesorter-header">
    <div class="tablesorter-header-inner">Header Text Here</div>
</th>

所以在div上我把这个css：

table.tablesorter thead tr th .tablesorter-header-inner {
    margin-right: 15px;
}