导航栏中的活动区域不是全高

Question

我有一个响应式网站，但导航栏给我带来了问题。

第一个问题是单击链接的活动区域不是导航栏的完整高度，我需要它一直向下。

第二个问题是，当我切换到移动视图时，菜单覆盖了电子邮件地址和电话号码。

我已经修复了导航和顶部，不确定这是否与此有关。

如果有人想看一下，我在测试地址上有页面 - http://www.classic-travel.co.uk/index.html

Answer 1

第一个问题：不是最好的解决方案，只是一个解决方法：

#cssmenu > ul > li {
float: left;
display: inline-block;
background: yellow;
color: black;
height: 104px; //ADD HEIGHT OF THE ul
}
#cssmenu > ul > li > a {
padding: 40px 10px 10px 10px;
border-right: 1px solid rgba(80, 80, 80, 0.12);
text-decoration: none;
font-size: 14px;
font-weight: 500;
color: black;
text-transform: none;
letter-spacing: 1px;
height: 100%; //LET li PICK THE HEIGHT OF ul
}

如果你找到一种方法不使用像素的高度，那就更好了。

第二个问题是由标题的位置：固定引起的，你去掉它，它不会被覆盖。

<header style="width: 100%; padding: 0px; background-color: rgb(255, 255, 255); z-index: 99; top: 0px; "><div class="gridContainer clearfix">
    ....
 </header>

在成瘾中，不要使用内联的css，将其放入.css文件中，并使用<link>标签包含在您的html文件中。