希望の境界線でナビゲーションタブを表示するには？テーブル、リスト、他の何か？
上記の画像を参照してください。各ナビゲーションタブは、両側で2ピクセルの間隔を持つ必要があり、エッジのヘッダーイメージと正確に一致します。
ここで、5番目のナビゲーションタブ（場合によっては6番目）を紹介します。それはあなたがそこに5番目または6番目のタブを貼り付けることができる方法でこれをコード化することが可能であり、すべてがリストやテーブルまたは他の解決策で適切にサイズ変更されるでしょうか？ 2ピクセルの間隔を維持し、エッジと正確に並んでいますか？それが可能かどうかわからなかったり、数学に基づいてタブごとに幅を定義しなければならず、すべての行を正確に一直線に並べる必要があります。
これは簡単ではないかもしれません。 css水平メニュータイプディスプレイのほとんどの実装における要件の1つは、各要素の固定幅を設定することです。パーセンテージを試してみると、物事が離れ始める。しかし、どんなことも可能です。
私はCSSでテーブルの動作をエミュレートすることをお勧めします。したがって、リストを使用することはできますが、依然として表の動作を取得できます。
ul {
display:table;
}
li {
display:table-cell;
}
Here is a demoこれをCSSと適切なマークアップで表示します。 Here's a demo実際のテーブルでどのように見えますか？私はIEの上で確信していない<このCSSのための8サポート、それは何かを認識している可能性があります。
更新日：確認済み：これはIE6または7でネイティブにサポートされていません。これらのブラウザーをサポートしたい場合は、表やハードコードされた幅で止まっているかもしれません。これらのdisplay値をサポートするjavascriptの修正があるかもしれませんが、私はそれを認識していません。
EDIT：私は私のデモがずさんだった実現ので、私は実際に余白についてあなたのポイントに対処している他は、それが均等に分散外観を与える、最初のリンクからマージンを削除する:first-childセレクタを使用して作られました。 http://jsfiddle.net/wesley_murch/pe6wd/3/
LESSまたはSASSを見てみましたので、CSSで簡単な計算をすることができましたか？