html - 菜单中的子菜单显示在带有母版页的网页形式的内容下，如何解决这个问题

Question

我有一个带菜单的母版页，其中有子菜单。我有一个添加到此母版页的 Web 表单，此表单有一个带有一些 UI 的表格。问题是子菜单显示在 contnet 页面下，但未显示在页面上。实际上它隐藏在内容页面下。

我需要设置什么属性才能在内容页面上显示子菜单。

     Css  for menu is 
     .nav {
float:left;
display:block;
left:220px;
position:absolute;
     }

     .nav ul

     {
list-style:none;
margin:0px;
padding:0px; }

     .nav li
     {
position:relative;
width:150px;
background-color:#333333;
text-align:center;
border-right:1px soloid white;
line-height:30px;
height:30px;
display:block;
float:left;
margin-right:1px;
}


     .nav li ul {
list-style:none;
visibility:hidden;
margin:0px;
position:absolute;
top:30px;
left:0; }

     .nav li ul li {
position:relative;
float:none;
width:150px;
height:auto;
padding-left:1px;
border-top:1px solid white;
margin:0;
text-align:left; }

     .nav a
{

text-decoration:none;   
color:#FFFFFF; }
     .nav li:hover ul {
visibility:visible; }


     .nav li:hover {
background-color:#3300FF;
font-size:1.3em; }

菜单代码是

     <div class="nav">

     <ul >
            <li> <a href="#">Home</a>    </li>
            <li> <a href="#">Products</a>  

                     <ul>
                            <li>
                                    <a>List of Products</a> 
                           </li>
                            <li>
                                 <a> List of Products </a>
                              </li>
                            <li>
                                <a>
                                List of Products
                                </a>

                            </li>

                    </ul>
                </li>
            <li> <a href="#">Services</a>    </li>
            <li> <a href="#">AboutUs</a>    </li>
            <li> <a href="#">Careers</a>    </li>

            <li> <a href="#">Contact Us</a>    </li>

     </ul>

     </div>

所有这些代码都放在 asp.net 的母版页中

Answer 1

我还需要查看代码和 CSS。 但这很像 css 问题。 尝试将子菜单设置为 position: relative; 并尝试设置 z-index: 10。

编辑
因为您添加了代码，所以我看到您不需要设置相对位置。您只需将 z-index:10; 设置为 .nav