2011-12-28 13 views
1

これは私のメニューのようになりましたあるものです:上部のナビゲーションメニュー項目の垂直整列

enter image description here

あなたは私が複数行のメニュー項目を持つことを望む見ることができるように。
私は今、どのように私のすべてのメニュー項目を垂直に整列するのだろうか?

<nav><div> 
<ul> 
<li><a>menu-item</a></li> 
.... 
</ul> 
</div></nav> 

任意の提案を歓迎:

はここで、現在のHTML構造です。ありがとう!このよう

+0

複数行のものはこれを困難にします。 – Purag

+0

はい、わかりました。私はこの1時間ずっと座っていた。 –

答えて

2

nav { 
    display: table; 
    width: 100%; 
} 

    nav ul { 
     display: table-row; 
    } 

     nav ul li { 
      display: table-cell; 
      vertical-align: middle; 
     } 
+0

はい、とても素敵なハック!!これらの属性についても知らなかった。 –

+0

IE7以下では動作しません。それが問題ならば。しかし、セレクタを 'body> nav'(または何らかの働き)で始めるように変更することで、現代のブラウザだけにこのスタイリングを与えることができます(そしてIE <8)の古いスタイリングを保つことができます)。 – powerbuoy

関連する問題