html - Spry 菜单文本糟糕的间距

Question

我有一个灵活的菜单，在菜单中有子菜单，数字之间的间距很糟糕。我几乎更改了 spry 菜单 css 中的所有内容，但间距不会改变。我认为它与 padding 有关，但无法确定。所以我的问题是:为什么子菜单文本之间的间距这么大？

Example Here .

这是子菜单 css 的内容:

ul.MenuBarHorizontal ul
{
margin: 0;
padding-top: .5em;
padding-right: .75em;
padding-bottom: 5em;
padding-left: .75em;
list-style-type: none;
font-size: 50%;
z-index: 1020;
cursor: pointer;
width: 83px;
position: absolute;
left: -100em;
border: 0px;
text-align: center;
top: 91px;
height: 307px;
    }

我看过其他问题，但似乎没有一个能回答我的问题。我已经阅读了 spry 菜单，但没有运气。也许其他人可以给我一些建议。

那么让我总结一下我的问题。我需要更改什么才能在子菜单中保留文本空间，使它们之间的距离不会太远？

Answer 1

您没有正确选择子菜单元素:

它应该类似于:

ul li ul li a{
}

或

ul.MenuBarHorizontal ul li a {
}

或

ul.MenuBarHorizontal ul li a {
    margin: 0;
    padding-top: .5em;
    padding-right: .75em;
    padding-bottom: 5em;
    padding-left: .75em;
    list-style-type: none;
    font-size: 50%;
    z-index: 1020;
    cursor: pointer;
    width: 83px;
    position: absolute;
    left: -100em;
    border: 0px;
    text-align: center;
    top: 91px;
    height: 307px;
}

尝试将鼠标悬停在其中一个子菜单上，右键单击并选择“检查”元素。您可以看到由您尝试定位的控件组成的 HTML。

一旦您有了正确的 CSS 选择器，您的样式就应该开始工作了。