嵌套的水平CSS菜单

我对嵌套的水平悬停很不满意。我要么无法隐藏嵌套子菜单，要么无法在悬停时显示它。我添加了以下内容以隐藏第一个子菜单：

enter code here
.menu-holder ul li ul li ul li{
    display:none;
 }

并执行以下操作以尝试将其显示：

enter code here
 .menu-holder > ul > li > ul > li:hover > ul{
  display: inline;
  }

当隐藏起作用时，显示不起作用。我不确定这是否是我最初隐藏子菜单的方式

有一件事我还没有解决，那就是让菜单在填充到右边之前先填充到左边的屏幕上

.wrapper{
宽度：500px；
高度：500px；
颜色：黑色；
}
.菜单架ul{
利润率：2px0px 25px；
填充：0；
列表样式类型：无；
}
.菜单持有人ul li{
位置：相对位置；
浮动：左；
填充：0px 10px 0 10px；
保证金：0px 0px 100px 0px；
左边框：1px点白色；
}
.菜单架ul li：悬停{
背景颜色：绿色；
}
.菜单支架ul li：悬停ul{
显示：块；
}
.菜单架ul li ul：悬停{
显示：块；
}
.菜单支架ul li.当前菜单项
{
背景：#999
}
.菜单架ul li ul li{
显示：无；
}
.菜单保持架>保险商实验室>保险商实验室>保险商实验室：悬停>保险商实验室{
显示：内联；
}
.菜单架ul li a{
字体系列：arial，无衬线；
字体大小：12px；
字体大小：粗体；
显示：块；
颜色：黑色；
文字装饰：无；
填充：15px 10px 15px 10px；
-webkit边界半径：5px 5px 0px 0px；
边界半径：5px 5px 0px 0px；
}
.菜单架{
浮动：无；
显示：无；
位置：绝对位置；
顶部：42px；
左：0px；
余量：-1px0px 10px；
填充：5px10px 5px10px；
空白：nowrap；
}
.菜单架ul li ul li{
位置：静态；
浮动：无；
显示：内联；
填充：5px10px 5px10px；
保证金：0px 0px 0px-10px；
背景色：#025179；
}
.菜单架ul li ul li a{
显示：内联；
利润率：0.0px 0.0px；
填充：0px 10px 0px 10px；
字体大小：正常；
-webkit边界半径：0；
边界半径：0；
}
.菜单架ul li ul li：第一种类型{
-webkit边界半径：0px 0px 0px 5px；
边界半径：0px 0px 0px 5px；
}
.菜单架ul li ul li：最后一种类型{
-webkit边界半径：0px 5px 0px；
边界半径：0px 5px 0px；
}
.菜单架ul li：第一种类型{
左边界：无；
}

项目1
项目2
照此



项目2
项目3
照此



项目2
项目3
项目4













​不太确定这是否是您想要的效果


.wrapper{
宽度：500px；
高度：500px；
颜色：黑色；
}
.菜单架ul{
利润率：2px0px 25px；
填充：0；
列表样式类型：无；
}
.菜单持有人ul li{
位置：相对位置；
浮动：左；
填充：0px 10px 0 10px；
保证金：0px 0px 100px 0px；
左边框：1px点白色；
}
.菜单架ul li：悬停{
背景颜色：绿色；
}
.菜单支架ul li：悬停>ul{
显示：块；
}
.菜单支架ul li.当前菜单项
{
背景：#999
}
.菜单架ul li a{
字体系列：arial，无衬线；
字体大小：12px；
字体大小：粗体；
显示：块；
颜色：黑色；
文字装饰：无；
填充：15px 10px 15px 10px；
-webkit边界半径：5px 5px 0px 0px；
边界半径：5px 5px 0px 0px；
}
.菜单架{
浮动：无；
显示：无；
位置：绝对位置；
最高：100%；
左：0px；
余量：-1px0px 10px；
填充：5px10px 5px10px；
空白：nowrap；
}
.菜单架ul li ul li{
位置：静态；
浮动：无；
显示：内联；
填充：5px10px 5px10px；
保证金：0px 0px 0px-10px；
背景色：#025179；
}
.菜单架ul li ul li a{
显示：内联；
利润率：0.0px 0.0px；
填充：0px 10px 0px 10px；
字体大小：正常；
-webkit边界半径：0；
边界半径：0；
}
.菜单架ul li ul li：第一种类型{
-webkit边界半径：0px 0px 0px 5px；
边界半径：0px 0px 0px 5px；
}
.菜单架ul li ul li：最后一种类型{
-webkit边界半径：0px 5px 0px；
边界半径：0px 5px 0px；
}
.菜单架ul li：第一种类型{
左边界：无；
}









项目1
项目2
照此



项目2
项目3
照此



项目2
项目3
项目4













​以下是您要查找的内容的语义正确的实现：

HTML
背景：
我为几年前开发的CMS设计了这个只有HTML/CSS的解决方案

显示/隐藏效果：
这些都可以使用css来完成
    <nav>
      <div class="container">
        <ul class="primary">
          <li class="active"><a href="#">Item</a></li>
          <li class=""><a href="#">Item</a></li>
          <li class=""><a href="#">Item</a>
            <div class="secondary-nav-container">
              <ul class="secondary">
                <li class=""><a href="#">Sub Item 1</a></li>
                <li class=""><a href="#">Sub Item 2</a></li>
                <li class=""><a href="#">Sub Item 3</a></li>
              </ul>
            </div>
          </li>
          <li class=""><a href="#">Item 4</a></li>
        </ul>
      </div>
    </nav>

    nav .primary-navigation {
      float: right;
      margin: 0px;
    }
    nav .primary-navigation li {
      float: left;
      margin: 0px;
      padding: 0px;
    }
    nav .primary-navigation li:last-child {
      margin-right: 10px;
    }

    nav .primary-navigation a {
      display: inline-block;
      width: 100%;
      padding: 0px 10px;
      text-decoration: none;
      font-size: 1.2em;
      line-height: 2.2em;
    }

    nav.mobile .secondary-navigation a {
      font-size: 1em;
      line-height: 2.3em;
    }

    nav .secondary-nav-container {
      position: absolute;
      top: 36px;
      left: 0px;
      width: 100%;
      min-height: 36px;
      display: none;
    }

    nav .primary-navigation > li.active .secondary-nav-container,
    nav .primary-navigation > li:hover .secondary-nav-container {
      display: block;
      z-index: 4;
    }

    nav .primary-navigation > li:hover .secondary-nav-container,
    nav.mobile .primary-navigation > li:hover .secondary-nav-container{
      z-index: 5;
    }

    nav .secondary-navigation, nav.mobile .secondary-navigation {
      float: right;
    }