css - jquery 数据表自定义标题悬停样式

Question

我有一个 jquery 数据表，我在其中创建自定义逻辑以显示当标题列标签处于 hover 状态时我需要的自定义样式。

这是我的 fiddle :

/* 更新 FIDDLE 不是最后一个 */ https://jsfiddle.net/y1b6puhn/

我需要的是排序图标在我的圆 Angular 矩形内，这样看起来流畅流畅。

所以我想要这样的东西，其中排序图标向左移动一点，所以当你悬停时，你会看到它在相同的位置，但在我的圆 Angular 矩形样式之上。:

Answer 1

我稍微编辑了你的 .table-rounded-header 似乎解决了这个问题:

#example .table-rounded-header {
    border-radius: 25px;
    background: #dcd9d9;
    padding: 5px;
    height: auto; /* for more the one line headers */
    width: 85%; /* instead of 100% */
    text-align: center; /* make it look nicer */
}

希望能解决。