CSS列表问题

Question

任何人都可以帮助解决这个CSS问题。当NavLevel2文本长度超过200像素时，我需要NavDropDown变宽。列表项中应该没有文本换行，NavLevel1应该始终为200px宽。

<div id="Nav"> 
    <ul> 
     <li class="NavLevel1" style="width: 200px; border: 1px solid Black;"><a><span>Level 1.1</span></a> 
      <ul id="NavDropDown" style="border: 1px solid Black;"> 
       <li class="NavLevel2"><a><span>Level 2.1.1 test to see if this will push the width out a little</span></a></li> 
       <li class="NavLevel2"><a><span>Level 2.1.2</span></a></li> 
       <li class="NavLevel2"><a><span>Level 2.1.3</span></a></li> 
      </ul> 
     </li> 
    </ul> 
</div> 

Answer 1

我贴到仓匆忙，刚找到我的解决方案。

<div id="Nav"> 
    <ul> 
     <li class="NavLevel1" style="width: 200px; border: 1px solid Black;"><a><span>Level 1.1</span></a> 
      <ul id="NavDropDown" style="border: 1px solid Black; position:absolute;"> 
       <li class="NavLevel2" style="white-space: nowrap;"><a><span>Level 2.1.1 test to see if this will push the width out a little</span></a></li> 
       <li class="NavLevel2"><a><span>Level 2.1.2</span></a></li> 
       <li class="NavLevel2"><a><span>Level 2.1.3</span></a></li> 
      </ul> 
     </li> 
    </ul> 
</div> 

Answer 2

将width样式更改为min-width。