html - 尝试调整表中列表中▲▼符号的大小，但字体大小无效

Question

我想要一个 ▲▼ 符号来表示特定表格列是可排序的(例如名称▲▼，但箭头彼此重叠)。为了把它放到一行中，我使用了一个列表:

<table class="test">
  <tr><th>test <ul><li>&#9650;</li><li>&#9660</li></ul></th></tr>
</table>

箭头太大，间距也不好。所以，为了设计我使用的结果:

   th ul{
        display:inline-block;
   }

.test th ul{
    font-size:5px;
    margin:0;
    padding:0;
}
.test th li{
    font-size:5px;
    margin:0;
    padding:0;
}

这是为了让组合字符变小，但 font-size 似乎对符号的大小没有任何影响。应该怎么做？

编辑:现在看来这在 Opera 中完美运行，并且这是某个 Firefox(我的版本是 32 位 Linux 20.0)的特定问题。事实上，它只影响箭头大小:

  <p>&#9650;</p>

body{
    font-size:5px;
}

这仍然会导致大箭头。任何人都可以确认这是 firefox 唯一的问题吗？

这很奇怪，我可能会使用图像。

Answer 1

也许这会有所帮助。使用图标字体而不是 html 符号。 https://github.com/aristath/elusive-iconfont

您还可以访问演示页面:http://shoestrap.org/downloads/elusive-icons-webfont/

或者，尝试 http://fortawesome.github.io/Font-Awesome/

两种字体集都有上/下插入符，但不是在一个符号中。