Cufon 导致下拉菜单中出现间隙

发布于 2024-10-23 11:47:30 字数 1138 浏览 2 评论 0原文

我遇到了此网站上下拉菜单的问题 http://www.leithonthefringe.com/（将鼠标悬停在表演者信息上即可查看问题）。

基本上主菜单和下拉菜单中的第一项之间会出现很大的间隙，它会影响 FF/IE/Chrome。

任何想法都非常感激！

CSS 如下：

#menu-main-nav {    margin: 0px; padding: 0px; }
#menu-main-nav li { float: left; list-style: none; height: 40px; font-size: 20px; }
#menu-main-nav li a { display: block; background: #333333; padding: 12px 24px 8px 24px; text-decoration: none; border-right: 1px solid #444444; color: #EAFFED; white-space: nowrap; }
#menu-main-nav li a:hover { background: #222222; }
#menu-main-nav li ul {  margin: 0px; padding: 0px; height: 40px; position: absolute; visibility: hidden; border-top: 1px solid white; z-index: +1 }
#menu-main-nav li ul li { float: none; display: inline; }
#menu-main-nav li ul li a { width: auto; background: #750000; color: #FFFFFF; border-right: none;  }
#menu-main-nav li ul li a:hover { background: #8d0101; }

//Update

问题似乎是 cufon 渲染了一个似乎不作为 cufon 文本存在的空白 - 关于为什么会发生这种情况的任何想法也表示赞赏。

解决方案是在 #main-menu-nav a 而不是 #main-menu-nav 上渲染 cufon...

原文

I'm stuck on a problem with the drop down menu on this site http://www.leithonthefringe.com/ (hover over performer information to see problem).

Basically a large gap appears between the main menu and the first item in the drop down, it affects FF/IE/Chrome.

Any thoughts greatly appreciated!

CSS is as follows:

#menu-main-nav {    margin: 0px; padding: 0px; }
#menu-main-nav li { float: left; list-style: none; height: 40px; font-size: 20px; }
#menu-main-nav li a { display: block; background: #333333; padding: 12px 24px 8px 24px; text-decoration: none; border-right: 1px solid #444444; color: #EAFFED; white-space: nowrap; }
#menu-main-nav li a:hover { background: #222222; }
#menu-main-nav li ul {  margin: 0px; padding: 0px; height: 40px; position: absolute; visibility: hidden; border-top: 1px solid white; z-index: +1 }
#menu-main-nav li ul li { float: none; display: inline; }
#menu-main-nav li ul li a { width: auto; background: #750000; color: #FFFFFF; border-right: none;  }
#menu-main-nav li ul li a:hover { background: #8d0101; }

//Update

The problem seems to be cufon rendering a white space that doesn't seem to exist as cufon text - any thoughts on why that would happen also appreciated.

The solution turned out to be to render cufon on #main-menu-nav a rather than #main-menu-nav...

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

轮廓§ 2024-10-30 11:47:30

路上有一个cufon。

<cufon class="cufon cufon-canvas" alt=" " style="width: 4px; height: 20px; "><canvas width="14" height="22" style="width: 14px; height: 22px; top: -2px; left: 0px; "></canvas><cufontext> </cufontext></cufon>

Theres a cufon in the way.

<cufon class="cufon cufon-canvas" alt=" " style="width: 4px; height: 20px; "><canvas width="14" height="22" style="width: 14px; height: 22px; top: -2px; left: 0px; "></canvas><cufontext> </cufontext></cufon>

回复收藏 0 原文