通常のhtml選択メニューがあります。Firefox はオプションをリンクとして扱いますが、IE はそうではありません。これは、ホバー時にリンクを変更する CSS コードが Firefox の選択メニューを台無しにしていることを意味します。どうすればこれを止めることができますか?
簡略化された選択メニューは次のとおりです。
<Select name='country' onchange='this.form.submit()'>
<option selected value='1'>USA</option>
<option value='2'>UK</option>
</Select>
簡略化された CSS は次のとおりです。
#rightnavigation {
font: 12pt Arial,geneva,sans-serif;
}
#rightnavigation :link {color: green; font: 10pt Arial,geneva,sans-serif;}
#rightnavigation :visited {color: red; font: 10pt Arial,geneva,sans-serif;}
#rightnavigation :hover {color: orange; font: 10pt Arial,geneva,sans-serif;}
マウスをメニュー上に移動すると、すべてのオプションのサイズがフォント 10 に変更され、IE のように黒のままではなく、Firefox ではオレンジ色に変わります。
クラスを作成して各オプションに適用しようとしましたが、これは選択されていないオプションでのみ機能しました。