3

HTML

<div id="menu">
    <a href="#">Commissions</a>
    <a href="#">Business Setup</a>
    <a href="#">Administrator</a>
    <a href="#">Content Management</a>
    <a href="#">Inventory</a>
    <a href="#">Communications Tools</a>
    <a href="#">Genealogy</a>
    <a href="#">Reports</a>
</div>

CSS

#menu {
    width: 1000px;
    float: left;
    font-size: 9pt;
    text-align: justify;
}
#menu a {
    text-decoration: none;
    color: #0066cc;
    font-size: 9pt;
}
#menu a:hover {
    text-decoration: underline;
}

各リンクを全幅にしたい。text-align: justify で実装しようとしました。しかし、それは機能していません。これどうやってするの?

4

3 に答える 3

2

あなたの質問を完全に理解しているかどうかはわかりませんが、意図されていないことをすることを正当化したいということの音によって.

テキスト行がコンテナーの右端で折り返される場合にのみ、テキストは両端揃えになります。

ただし、これは実際にはメニューでは発生しません。

したがって、正当な修正 (何も壊れていませんが、修正と言いました) の代わりに、別の提案があります。

私の理解では、リンクをdiv全体に均等に分散させたいと考えています。

私が考えることができる最善の方法は、リンクの数に基づいて要素にパーセンテージベースの幅を与え、正当化するのではなく中央に揃えることです。

例えば:

#menu a {
    text-decoration: none;
    color: #0066cc;
    font-size: 9pt;
    width: 12%;
    display: inline-block;
    text-align: center;
}

それがあなたの望むものかどうかはわかりませんが、試してみてどう思うか見てみましょう。

于 2010-12-19T12:41:12.617 に答える
0

いいえ。すべてのリンクの長さが異なります。ただし、これらのリンク間の長さは同じにする必要があります。

テーブルソリューションしかありません。http://jsfiddle.net/Flack/Q7z6q/

私はそれが汚いことを知っています、そして誰かがより良いアイデアを持ってきたらうれしいです.

于 2010-12-19T12:52:26.887 に答える