-1

現在、正しく表示されている場合、ナビゲーション バーに問題はありません。しかし、私はOCDの男なので、不適切な、または異常な視聴も解決したことを確認したい.

現在、私のナビゲーション バーは、リンクが | で区切られた 1 本の水平線で構成されています。いくつかの CSS ロールオーバー ハイライト。私の意見では、仕事をうまくこなすシンプルなセットアップ。しかし、ズームインすると、最終的には最後のリンクにスペースがなくなる段階に到達し、次の行に移動します。見栄えが悪いですよね、明らかに。max-width:100% を入れてみましたが、違いはありませんでした。

関連するコードは次のとおりです。

<div class="navbarwrapper">
    <div class="navbar">
        | <a href="" class="navbar"></a> |
        <a href="" class="navbar"></a> |
        <a href="" class="navbar"></a> |
        <a href="" class="navbar"></a> |
        <a href="" class="navbar"></a> |
        <a href="" class="navbar"></a> |
        <a href="" class="navbar"></a> |
    </div>
</div>

.navbarwrapper {
    margin-bottom: 10px;
    text-align: center;
    margin-left: auto;
    margin-right: auto;
    min-width: 800px;
}
.navbar {
    padding: 10px;
}

先ほど言ったように、通常の状況では問題なく動作しますが、拡大すると (または解像度が低いと思います)、最後のリンクが 2 行目に流れます。

4

3 に答える 3

0

アンカー タグはインライン要素です。それは、スペースがなくなったときに行うべきことです。それらに異なる動作をさせたい場合は、必要な動作overflowのラッピング要素を設定する必要があります。

于 2012-11-22T22:01:40.117 に答える
-1

<li>メニュー DEMOで使用してみてください

于 2012-11-23T00:00:33.000 に答える
-1

オーバーフロー: 非表示; 固定幅を持つ必要がある親 div ;)

于 2012-11-23T08:14:14.867 に答える