请教用CSS + DT、DD做可折叠菜单，二级菜单为什么会重叠在一起？_html/css_WEB-ITnose

<dl class="nav_dl">   <dt><a>测试测试1</a></dt>   <dd>      <ul>          <li>测试</li>         <li>测试</li>     </ul> </dd> <dt><a>测试测试1</a></dt>   <dd>      <ul>          <li>测试</li>         <li>测试</li>     </ul> </dd> <dt><a>测试测试1</a></dt>   <dd>      <ul>          <li>测试</li>         <li>测试</li>     </ul> </dd></dl>

ul, li, dl, dt, dd{ list-style: none outside none;  margin: 0px;    padding: 0px;}.nav_dl{  position: relative; float: left;    margin-left: 35px;}.nav_dl dt{  float: left;    width: 100px;   height: 45px;}.nav_dl dd{   position: absolute; top: 45px;  width: 100px;   color: #606060; border: 2px solid #CC0000;}

<ul class="nav_dl">   <dl>      <dt><a>测试测试1</a></dt>       <dd>          <ul>              <li>测试</li>             <li>测试</li>         </ul>     </dd> </dl> <dl>      <dt><a>测试测试1</a></dt>       <dd>          <ul>              <li>测试</li>             <li>测试</li>         </ul>     </dd> </dl> <dl>      <dt><a>测试测试1</a></dt>       <dd>          <ul>              <li>测试</li>             <li>测试</li>         </ul>     </dd> </dl></ul>