子菜单翻转弹出不显示

Question

希望这对于你们中的一些CSS退伍军人来说是一个简单的答案。

我正在为客户开发一个网站。为了便于阅读，我将为您提供指向该网站和相关CSS页面的链接。 HTML CSS

当您滚动“Star Quartz Grout”时，我正在尝试在主菜单右侧弹出一个子菜单。我现在的CSS显然不正确，我可以使用一些指导。

ul#subNav {display: none; width: 134px; }
li:hover ul#subNav, li.over ul#subNav {display: inline-block; position: absolute; top: 0px; left: 134px; }

我的猜测是它正在工作，但它隐藏在页面的其余部分后面。我可能错了。即使使用Chrome的“Inspect Element”（非常好的顺便说一句），也很难确认。这可能是一些愚蠢的错误。无论如何，提前谢谢。我是一个CSS新手。

Answer 1

你可以试试这个：

ul#subNav ul
{
display: none;
}

ul#subNav li:hover ul
{
display:block;
}

但要小心，因为你的“li”区域比链接本身小。

我在这个网站上这样做了：Spirit Of Polo（将鼠标悬停在购物车上）。 请注意，这种效果（悬停）在触摸屏设备上是不可见的（因为如果你想一想就不可能悬停）