幅=親の幅CSS3

Question

私はCSS3の計算について少しは読んだことがありますが、特にこれを見つけるのは難しいです。私はドロップダウンメニューを使ってサイトを構築していますが、ドロップダウンを可変幅の親アイテムの幅と一致させたいと思います。私はいつもそれぞれのドロップダウンのための特別なIDまたはクラスを設定することができますが、それは少し痛みです。

HTMLが同じように構成されています。

<ul> 
    <li> 
     <a href="#">Parent Item</a> 
     <ul class="sublist"> 
      <li><a href="#">Sub Item</a></li> 
      <li><a href="#">Sub Item</a></li> 
     </ul> 
    </li> 
    <li><a href="#">Normal Item</a></li> 
    <li><a href="#">Normal Item</a></li> 
    <li> 
     <a href="#">Parent Item</a> 
     <ul class="sublist"> 
      <li><a href="#">Sub Item</a></li> 
      <li><a href="#">Sub Item</a></li> 
     </ul> 
    </li> 
    <li><a href="#">Normal Item</a></li> 
</ul> 

=親幅か何か幅にそれを設定するためにCSS3を使用した方法はありますか？

Answer 1

div内の親アイテムを折り返し、そのdiv内のulの幅を100％（またはパディングする場合はそれ以下）に設定し、position：relativeにネストします。

そう...

<li> 
    <div id='parent'><a href....></a> 
     <ul class='sublist' style='width:100%;'> 
      <li>...</li> 
     </ul> 
    </div> 
</li> 

あなたが位置していることを強化する必要があるかもしれません：サブリストULの依存既存のスタイルのための相対的な。 Dave