-1

現在、独自のワードプレスのテーマを書いていますが、サブメニューに問題があります。以下の例の「イベント」リンクにカーソルを合わせた後にサブメニューが表示されるようにします。一部のブラウザでは、サブメニューは「イベント」リンクの下に表示され、左側に 5px の余白があります。これで問題ありません。他のブラウザー (Win 7 上の Firefox 17) では、サブメニューは本来あるべき「イベント」テキストの下ではなく、「イベント」リンクの右側に表示されます。

なぜこれが起こるのか、どうすればそれを取り除くことができるのか誰かが知っていますか?

ありがとう。

例: http://codepen.io/anon/pen/pqAIy

4

2 に答える 2

0

このコードを追加します

nav .menu li {
position:relative;
}

nav .menu li:hover .sub-menu {
    display:block;
        left:0;right:0;top:18px;
        position: absolute;
}

デモ

このコードはユニバーサルです すべての最新および標準ブラウザを実行します

于 2013-04-29T12:34:20.363 に答える
0

変更する必要があるのは、コードのこの部分です。 

.menu-item:hover .sub-menu {
        display: inline-block;
        position: absolute;
}

これに：

.menu-item:hover .sub-menu {
        display: block;
        position: absolute;
}

(ブロックするためのインラインブロック)

于 2013-04-29T12:04:28.807 に答える