如何在CSS中使用最小寬度的繼承？

這看起來很簡單，但我無法得到正確的語法w /下面的情況。我爲屏幕頂部定義了一些下拉菜單。我希望列表項（每個LI）儘可能與其父母LI一樣寬。對於最小寬度和繼承來說，這似乎是一件容易的工作，但我一直無法使它正常工作。如何在CSS中使用最小寬度的繼承？

現在，「繼承」這個詞在VS中被加下劃線，就好像它不被識別一樣。頁面將會建立/加載正常，但顯然不會讀取參數，因爲LI控件的寬度不及它們的父級LI的寬度。任何幫助表示讚賞。

這裏是我的HTML的一部分：

<ul id="javascriptDDM"> 
    <li><a href="#"> MAIN OPTION 1 </a> 
     <ul> 
      <li><a href="../somePage.aspx?type=1"> Choice 1 </a></li> 
      <li><a href="../somePage.aspx?type=2"> Choice 2 </a></li> 
      <li><a href="../somePage.aspx?type=3"> Choice 3 </a></li> 
     </ul> 
    </li> 
    <li><a href="../mainPage.aspx"> MAIN OPTION 2 </a> 
     <ul> 
      <li><a href="../somePage.aspx?type=1"> Choice 1 </a></li> 
      <li><a href="../somePage.aspx?type=2"> Choice 2 </a></li> 
      <li><a href="../somePage.aspx?type=3"> Choice 3 </a></li> 
     </ul> 
    </li> 
</ul>

...編輯 - 這裏是所有的javascriptDDM CSS的：

#javascriptDDM { width: auto; margin: 0; padding: 0 }  
    #javascriptDDM li { width: auto; float: left; list-style: none } 
    #javascriptDDM li a { display: block; background: #606668; padding: 5px 12px; text-decoration: none; border-right: 1px solid white; border-top: none; color: White; white-space: nowrap; background-position:left center; } 
    #javascriptDDM li a:hover { background: #999999; color: #FFFFFF; } 
     #javascriptDDM li ul { width: auto; margin: 0; padding: 0; position: absolute; visibility: hidden; z-index: 1000 }   
     #javascriptDDM li ul li { min-width: inherit; float: none; display: inline }   
     #javascriptDDM li ul li a{ color: #FFFFFF;background: #999999 }   
     #javascriptDDM li ul li a:hover { color: #000000; background: #FFFFFF}

來源

2011-06-29 WEFX

'#javascriptDDM li ul li'的'min-width'是什麼？ – BoltClock

我沒有明確定義任何其他#javascriptDDM控件的寬度，所以它們只是使用auto。 – WEFX

那你期望'a'繼承？ – BoltClock

繼承將使min-width屬性採用與父母的min-width屬性相同的「指定」值。如果您沒有在父元素上設置min-width，則它不會有任何值。

來源

2011-06-29 21:31:09 AlicanC

儘管父元素都是AUTO，因爲它們包含不同長度的文本。如果我將父級設置爲AUTO，並且呈現寬度爲120px，那麼孩子的寬度是多少？它會是AUTO還是120px？ – WEFX

@WEFX：這是'auto' – BoltClock

在我的情況下，設置父控件的寬度不會有幫助，因爲寬度是AUTO。我將使用一些javascript來動態獲取/設置寬度。 – WEFX

首先，你應該設置你的LI顯示模式塊。在這種情況下，您至少可以控制它的寬度。

來源

2011-06-29 21:30:21

WEFX

只有「塊級」元素將繼承父母的寬度。「a」元素本質上不是「塊」級元素。因此，爲了解決這個問題，您應該爲「a」元素添加一個「display：block」，或者將最小寬度CSS放在li上，而不是a上。

來源

2011-06-29 21:37:39 jffgrdnr

我已經將最小寬度添加到li（請參閱上面的問題編輯）...無濟於事。 – WEFX

如何在CSS中使用最小寬度的繼承？

回答

相關問題