显示带排序指示符的省略号

Question

In my fiddle我有三个如何在表头上显示排序指示器的示例。

我的问题出在第三栏。当我缩小到省略号时，排序指示器隐藏在Chrome中，在IE中它被放置在文本的顶部。

铬

IE

在显示省略号时，有没有办法让排序指示符保持与标题紧密相连，保持可见？（

）

我已经尝试将指标分解到自己的范围内，但我似乎无法通过标题来解决问题。

Answer 1

对我来说，这在IE中比Chrome更明显。解决这个问题的一种方法可能是使用CSS content属性并将排序指示器移动到该属性中，并从.indicator-right类中删除背景图像。

<强> jsFiddle example

CSS

.indicator-right:after {
    content:url(data:image/gif;base64,R0lGODlhFQAJAIAAACMtMP///yH5BAEAAAEALAAAAAAVAAkAAAIXjI+AywnaYnhUMoqt3gZXPmVg94yJVQAAOw==);
}