在p：layout中悬停后，JSF PrimeFaces MenuBar下拉子菜单消失

Question

在JSF PrimeFaces 3.1.1中做一些应用程序（仍在学习），我实现了整页布局 - Sunny（ <p:layout />标签）。 Everytihng很好，除了我的菜单栏。

在鼠标悬停在菜单中的子菜单按钮上时，下拉子菜单会显示，但是当我想通过鼠标进入子菜单时，它会消失。 唯一的选择是将鼠标位置更快地更改为子菜单 - 而不是保留。 这就是问题，需要它正常工作，而不是消失。

如果我将布局排除，菜单栏再次运行良好。 还尝试从PF展示中复制和粘贴代码，问题也一样。

在Tomcat 7.0.22.0上使用JSF 2。 这是我的代码......

模板中的菜单栏：

<p:layoutUnit position="north" size="130">
    <ui:insert name="top">
        <p:menubar id="mainMenu" model="#{menu.mainMenu}" />
    </ui:insert>
</p:layoutUnit>

CSS解决溢出问题：

.ui-layout-north .ui-layout-unit-content {
    overflow: visible !important;
}

.ui-layout-north {
    z-index: 30 !important;
    overflow: visible !important;
}

感谢帮助！

Answer 1

您是否碰巧为您的ui-widget设置了自定义字体大小？ 就个人而言，我有以下CSS设置：

.ui-widget {
    font-size: 12px !important;
}

我在Firefox中遇到过与你类似的问题（但不是在Chrome中）。 奇怪的是，在将字体大小增加到13px之后，问题得到了解决。

Answer 2

菜单栏在IE或Chrome中运行，但在firefox中没有正确显示你可以看到在使用firefox检查这个看看会发生什么:)

我解决了这个问题

    .ui-menubar .ui-menuitem-text {
    font-size: 13px!important; top: -1px;
}

Answer 3

这不是理想的，但它解决了我的问题：

.ui-menuitem-link
{
    max-width: 180px;
}

Answer 4

请查看下一个链接http://forum.primefaces.org/viewtopic.php?f=3&t=16597 。

这是一个字体问题。

这也出现在Firefox 27和Prime Faces 4.0 RC中。

在其他浏览器中运行良好。