Css 无法在nav中的li内垂直对齐ul

我正在尝试在一个li内垂直对齐一个ulsubNav.ul

 <nav id="nav">
   <ul>
       <li class="subNav"><a href="somePage1.php">Some Page1</a>
          <ul>
              <li><a href="relatedPage1">Related Page1</a><li>
              <li><a href="relatedPage2">Related Page2</a><li>
          </ul>
       <li>
   </ul>
  </nav>

“设置属性”为div1 nav ul=显示：内联块；保证金：0px，自动；文本对齐：居中；垂直对齐：中间对齐；列表样式类型：无； 和nav li.subNav ul=可见性：隐藏；&显示：块被覆盖。我可以对这个标签做些什么来让列表项垂直对齐而不是水平对齐。

删除浮动：左形导航li。子导航：悬停ul li

同时删除浏览器提供的默认边距和填充

ul{
    margin:0;
    padding:0;
}

还可以使用“通用选择器”删除浏览器给定的所有图元的默认样式

*{
    margin:0;
    padding:0;
}

---

这是我对上述问题的解决办法

 #nav li.subNav:hover ul li {
      visibility: visible;
      width:  171px;
      padding: 0;
      cursor: pointer;
      float: none !important;
      display: block !important;
  }

我还找到了一种方法来保持菜单——一旦可见——不让“主体”在页面上向下移动

  #nav li.subNav ul {
       display: block;
       visibility: hidden;
       position: absolute;
   }

---

请创建一个工作的代码段。你说的代码段是什么意思。我该怎么做？还是我们只是想了解更多细节？这是定制的样式表。这是另一个样式表：上面是nav和SUNBNAV的总体结构structure@emmanuel嘿，谢谢你的帮助。当我将鼠标悬停在子菜单上时，我已经列出了大部分代码，顶级菜单将扩展到子菜单中项目的宽度。如果我能让subNav:li垂直排列，那可能会有所帮助。TIAI仍在尝试让顶级菜单下方的li垂直排列。请看一下前面注释的语句中的代码，如果您看到缺少或不合适的内容，请告诉我

 #nav li.subNav:hover ul li {
      visibility: visible;
      width:  171px;
      padding: 0;
      cursor: pointer;
      float: none !important;
      display: block !important;
  }

  #nav li.subNav ul {
       display: block;
       visibility: hidden;
       position: absolute;
   }