3

固定レイアウトを作成しましたが、すべてのブラウザーでうまく機能します。ただし、少なくとも1つのホイールスクロール（90％）をズームアウトすると、2番目のナビゲーション（＃header-navigation）アイテムがより多くの行に分割され、下の要素がその場所から押し出されます。emと％を使用してフォントサイズ、パディング、マージンを設定しようとしましたが、うまくいきませんでした。オーバーフローを作成した場合：＃header-navigationで非表示にすると、問題なく最大50％までズームアウトできます。それで十分ですが、非表示にすることはできません。

あなたはここでそれを見ることができます：http：//palivonas.lt/test/stackoverflow/

編集：ChromeとIE9で動作するようになりました（@GGGに感謝）が、ナビゲーションで行が途切れなくなったとしても、Firefoxは#socialボックスを押し下げます。

4

1 に答える 1

1

これが修正です。

リスト項目のdisplayプロパティをに変更しinline-block、 を削除しfloatます。

#header-navigation li {

    background: url(images/slash_header.png) right no-repeat;
    padding-right: 26px;
    margin-right: 19px;
    display: inline-block;

}

white-space: nowrapナビゲーションを含む順序付きリストに追加します。

ol, ul {

    list-style: none;
    white-space: nowrap;

}
于 2012-05-12T08:24:47.050 に答える