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。