Question

我在https://admin.vybenetworks.com/vybe/dropdown/有一个下拉菜单，除了一件事情以外工作正常。子菜单与导航的顶部对齐，而不是与其所属的菜单项对齐。例如，在＆＃34; Billing＆＃34;有一个名为＆＃34; Reports＆＃34;的子菜单。有一个名为＆＃34; Sales Report＆＃34;的项目。子菜单显示在＆＃34;重复计费＆＃34;附近。项目而不是＆＃34;报告＆＃34;之一。

我尝试搜索此问题但实际上很少有关于此问题的点击。我认为包含元素（LI）是＆＃34; position：relative＆＃34;子菜单（UL）是＆＃34;位置：绝对＆＃34;但它总是把它相对于父UL。

感谢任何提示。

Answer 1

在286px行的Vybe.css文件中，你有一个像这样的元素：nav ul ul ul。将此元素的属性顶部更改为：

nav ul ul ul {
    /* other code here, don't copy this comment */
    top: 252px;
    /* other code there, don't copy this comment */
}

它会使子菜单元素在其对应的父元素旁边滑动。您可以根据自己的需要进行修改，但我认为252px是现货。

让我知道这是否有效/不适合你。

Answer 2

在你的CSS文件Vybe.css中，更新以下内容，

NAV UL UL LI {
  border: none;
  float: left;
  position: relative;
  width: 100%;
}
NAV UL UL UL {
  left: 105%;
  top: 0;
  border-style: none;
  width: 195px;
  position: absolute;
}

float:none已替换为float:left，left:100%已替换为105%，top:30px已替换为top:0

CSS下拉子菜单垂直对齐

2 个答案: