CSS <ul> - <li>菜单：<a> element width height setting</a> </li> </ul>

Question

我现在试图解决这个问题几天了。我无法将Child1,2和3放在25px橙色点之间。父菜单和子菜单是基于CSS的ul - li菜单，我将<a>设置为内嵌块并设置宽度和高度但是它仍然忽略那些参数。我对如何解决这个问题缺乏想法。感谢您的帮助。

由于代码的长度，我决定上传“整个”源代码： source.zip

Answer 1

问题是子菜单上的<a>标记与主菜单中的padding:15px有关。您需要将其设置为0.然后，您可以将元素的line-height设置为与橙色栏的height相匹配，使其垂直居中。

添加此项以修复它：

#header .cssMenuA a{
    padding:0;
    line-height:25px;
}

Answer 2

看起来Child 1,2,3 a标签已经应用了填充，将它们向下推过橙色。看截图：

尝试从a标签（bodystyle.css，第78行）中删除填充，然后仅将其重新应用于父菜单项。

Answer 3

您在导航列表中的所有<a>元素周围都有15px的填充（包括PARENT），但这也适用于“Childs”。添加规则：

#header li li a {
    padding-top: 0;
}

这可能与您想要的完全不同，因为<a>设置为25px高，但字体小于此值。还要添加

#header li li a span {
    line-height: 25px;
}