在Firefox中的文本上方显示链接下划线？ [英] Link underline appearing above text in Firefox?

问题描述

在我的网站上，在2012年在bugzilla报告，这是我在上面上面文本中出现的唯一的东西。它指向 vertical-align 可能是这个的原因。我改变了 vertical-align 在滑块CSS，但没有什么区别（ top ， middle 或底部。）我想修复它。

解决方案

您正确地识别了 vertical-align 作为罪魁祸首。

hover项目正在jqueryslidemenu.css中的这一行样式：

  .jqueryslidemenu .app {
 height：18px; 
 vertical-align：middle; 
} 
  

当我删除 vertical-align 在Firebug，问题消失。因此，从该行中删除 vertical-align 。

如果你不能编辑jqueryslidemenu.css，将以下内容添加到您自己的css文件中：

  .jqueryslidemenu .app {
 vertical-align：inherit; 
} 
  

On my website, http://forums.jordantrudgett.com/ I have a glitch on links in my drop-down menu. I'm using code from Dynamic Drive jQuerySlideMenu.

In Firefox 19, the underlines appear above the text.

This is how it's supposed to appear, in Chrome 27:

and in Internet Explorer 10:

I've inspected the elements in Firebug but I'm not sure exactly what's causing this issue. There is no CSS playing with the underline that I can see.

After some quick searching, I found this issue reported in bugzilla in 2012, which is the only thing I found on underlines appearing above the text. It points to vertical-align possibly being the reason for this. I changed vertical-align in the slider CSS but it made no difference (top, middle or bottom.) I'd like to fix it. Is there anything blatantly obvious I'm missing, or some good reason this is happening?

解决方案

You correctly identified vertical-align as the culprit.

The hovered item is being styled by this line in jqueryslidemenu.css:

.jqueryslidemenu .app {
    height: 18px;
    vertical-align: middle;
}

When I remove vertical-align in Firebug, the problem disappears. Thus, remove vertical-align from that line.

If you cannot edit jqueryslidemenu.css for whatever reason, just add the following to your own css file:

.jqueryslidemenu .app {
    vertical-align: inherit;
}

这篇关于在Firefox中的文本上方显示链接下划线？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！