Bootstrap 3中的工具提示在Firefox中有不需要的CSS效果

Question

请查看我的实时网站http://mozzor.com并将鼠标悬停在顶部的圆形图标上。注意两个仅在Firefox中出现的效果（我使用的是FF23）：

1） 工具提示的文本中添加了一条蓝色下划线

2） 文本在悬停时呈现，然后过了一会儿，似乎模糊了自己。

我在使用Firebug调试时遇到问题。。。我找不到与这两种效果对应的css元素。

为了以防万一，这里有一些关于我如何设计工具提示样式的相关代码：

// Variable currentSelect corresponds to hex color value
// selected in the jQuery widget seen at the top left side of the page
$('#notebookIcon,#pencilIcon,#headphoneIcon').tooltip().on("mouseover", function () {
    var tooltip = $(this).next(".tooltip");
    //Box
    tooltip.find(".tooltip-inner").css({
        backgroundColor: "#fff",
        color: currentSelect,
        borderColor: currentSelect,
        borderWidth: "1px",
        borderStyle: "solid"
    });
    //Arrow
    tooltip.find(".tooltip-arrow").css({
        //borderTopColor: currentSelect,
        //borderLeftColor: currentSelect,
        //borderRightColor: currentSelect,
        borderBottomColor: currentSelect
    });
});

编辑：第二个问题似乎是处理Firefox中字体混叠缓慢。尝试几种不同的字体后，问题仍然存在。有关更多信息，请参阅以下内容：

Github问题：https://github.com/twbs/bootstrap/issues/10218

Bugzilla问题：https://bugzilla.mozilla.org/show_bug.cgi?id=909814

Answer 1

您的第一个问题是下划线，它由CSS text-decoration属性决定。我不太清楚为什么会在Firefox上发生这种情况（Chrome似乎是正确的，因为菜单项的文本装饰设置为无）。这是一个快速解决方案，但我会看看是否能找到原因。

#iconrow a {
    text-decoration: none;
}

关于第二个问题：我不明白为什么CSS不能做到这一点。