0

px の代わりに % 値を使用すると問題が発生します。例: http://jsfiddle.net/FXZMS/1/は思い通りに動作します。「About」にカーソルを合わせると、ドロップダウン リストが表示されます。ただし、リスト項目間の間隔が画面サイズに依存するように、% 値を使用することをお勧めします。

私は10％の値で試してみましたが、これが起こります： http://jsfiddle.net/FXZMS/2/

上記の例では、私が変更しているのは次のとおりです。

#navcontainer ul a {
    border: 1px solid #000;
    display: inline-block;
    padding-right: 10%;
    padding-left: 10%;
}

最初の例ではパディング値は 56px で、2 番目の例では - 10%

% 値を使用すると、「About」にカーソルを合わせると、ドロップダウン リストが... 奇妙に見えます。なぜこれが正確に起こるのか誰か教えてもらえますか？

4

2 に答える 2

0

メニュー要素をに設定してwidth:25%、子要素にも同じことをしてみませんか。追加text-align: centerすると、すべてがきれいに均一に見えるはずです.

于 2013-07-27T15:18:03.507 に答える
0

これを試して：

追加された CSS

#navlist > li > a {
    padding-right: 4.5%;
    padding-left: 4.5%;
}

#navlist ul {
    width:100%;
}

デモ

私はあなたが持っていた CSS を変更しませんでしたが、これを CSS の下に追加しただけです。CSS の上に追加されたこの部分を置き換えることができます。

于 2013-07-27T15:23:22.593 に答える