background-color - 角が丸く、背景色が重なっているCSS選択

Question

背景色のある選択した要素に境界線の半径を適用しています。境界線の曲線をたどる代わりに、背景色が曲線と重なり、正方形のボックスに表示されます。この問題を解決するために使用する必要のあるcssプロパティがわかりません。

background-color: #FF0;
border-radius: 24px;
border: 4px solid #F09;

これがjsfiddleです：http：//jsfiddle.net/JsgnR/

ご協力いただきありがとうございます

Answer 1

これについての私の感じは、これをすべての一般的なブラウザで機能させるには、JSでselectを再構築する必要があります...残念ながら、divboxのようなcssでselectをスタイリングすることは期待どおりに可能ではありません。最新のFirefoxでは、ブラウザでコードが見栄えがします。firefoxは境界線を選択範囲とオーバーラップさせることを決定したためです。最新のオペラでは、境界線は選択範囲の下にあります。

オプションで、cssを使用してスタイルを設定してみてください。できず、見栄えがよくありません。

Answer 2

<select>要素をラップし<span></span>て、必要なプロパティをcssに追加できます。

このソリューション： http： //jsfiddle.net/JsgnR/5/