Question

我在techprosecurity.com上遇到两个css问题，我一直很难找到如何修复。当您将鼠标悬停在当前未选择作为活动链接的任何链接上时，标题中的NAV菜单占用的空间很小。我搜索了可能删除该间距而不损坏菜单外观的任何属性，但不幸的是没有成功。

例如：

我的第二个问题是，在移动设备上，导航栏上的子菜单链接最终隐藏在主滑块图像后面，并要求用户滚动菜单以查看并单击任何子菜单链接。我尝试在许多样式上更改Z-Index，但不能让它坐在图像上。但是，它正在开发ipads以及其他可能位于图像上方的平板电脑。

移动设备上的示例：＆＃39;＆＃39; /Screen%20Shot%202015-06-15%20at%202.01.06%20PM.png

平板电脑上的示例：＆＃39;＆＃39; /Screen%20Shot%202015-06-15%20at%202.01.22%20PM.png

如果有人能提供帮助那就太棒了！

Answer 1

.menu ul>li>a {
  color: #fff;
  font-weight: 400;
  font-size: 14px;
  line-height: 18px;
  padding: 10px 15px;
  overflow: hidden;
  border-bottom: 3px solid transparent; <-- REMOVE THIS
}

删除border-bottom

第二个问题：它是一个引导问题：

.navbar-collapse.in {
  overflow-y: auto; <-- CHANGE TO INHERIT
}

Answer 2

在未选中的链接底部添加一些额外的填充，我认为padding-bottom: 34px;将为您执行此操作，目前该空间来自仅显示在所选链接上的小蓝色箭头，所以要补充一些额外的填充到未选择链接的底部。

标题菜单CSS问题

2 个答案: