は、CSSでメニュー項目の幅を自動的に計算します

Question

ul liで作成したメニューがあります。私はcssでメニュー項目を自動的に配置したいので、メニュー項目のテキストを変更した後に位置が再計算されるようにします。この例では、フィドルの配置はパディングで行われます。この場合、テキストが長くなると、次の行に移動します。

例フィドル：私たちのサイトのナビゲーションは常にクライアントによって構築され、私たちはそこになりますどのように多くのアイテム見当もつかないしているため

http://jsfiddle.net/amkrtchyan/9WbaC/

Answer 1

これは、私が常に持っている問題です。あなたはソートのtable型ディスプレイのプロパティでこれを行うことができます

：

nav {display:table;} 
nav ul {display:table-row;} 
nav ul li {display:table-cell;} 

これに加えて、私はあなたのリスト項目からfloatを削除：

• ここで、それはたくさんのようになりますのアイテム：http://jsfiddle.net/9WbaC/2/

テキストを空白で使用していますこれはラップしてしまいます。ここで

• は、それが唯一のいくつかの項目で次のようになります。あなたが全体の幅を知っていればhttp://jsfiddle.net/9WbaC/3/

別の解決策は、ハードコードする割合（またはpxとサーバー側の幅がインラインでありますピクセル）に基づいて、いくつのトップレベルアイテムが存在するかに基づいて決定される。