フィールドセットの丸い角

Question

"fieldset"タグは、IE上で丸い角の境界線をレンダリングすることに気付きました（他のブラウザでは四角形にレンダリングされます）。

<fieldset> 
     <legend>My legend</legend> 
</fieldset> 

ただし、フィールドセットにCSSスタイルを設定すると、丸い角が消えます。

誰でも知っていますか？ 角の丸みを保つにはどうしたらいいですか？

[EDIT]：混乱のため申し訳ありませんが、私は、Firefox /他のブラウザに丸い角を持つようにどのように質問しないで、私はボーダー（IEに丸い角を維持し、別の境界線の色を持っている方法を知りたいです-color：赤;フィールドセット上でラウンドを四角に変更します...）。

Answer 1

デフォルトでシステムに視覚的なスタイルを使用している - と、デフォルトのWindows XP/Vistaのテーマで、フィールドセットは、CORを四捨五入している：FirefoxとSafariの上ners。たとえば、ディスプレイのプロパティを見てください。<input />にスタイルを割り当てると、ホバー効果、グラデーションなどが失われます。

Answer 2

WHYのように、ブラウザが異なる動作をすることは秘密ではありません。

-moz-border-radius属性について調べましたか？

Iは、Firefox/Mozillaの中

fieldset { 
    -moz-border-radius:5px; 
    border-radius: 5px; 
    -webkit-border-radius: 5px; //edit :D 
} 

作品のようなものだと思うが、私が試したので、長い時間されています：D

Answer 3

あなたが働くであろう、CSS 3の国境-radiusプロパティを使用することができますいくつかの項目（ボタン、入力ボックス）

fieldset { 
-moz-border-radius: 5px; 
-webkit-border-radius: 5px; 
} 

Answer 4

IEの境界線は、1）「パフォーマンス」の下にある「ボタン上のウィンドウにビジュアルスタイルを使用」がある場合のみです。ビジュアルエフェクトタブ。それを鈍らせるには：XPのテーマ設定を有効にすると、丸みを帯びてしまいます。古典的なWin2000の外観では、丸められません。

第2の要件2）は、フィールドセットに「ボーダー関連のCSSなし」です。境界線の色、境界線のスタイル、または境界線の幅を割り当てると、「丸み」がなくなり、回避策はありません。入力（ボタンとフィールドの両方）、テキストボックス、および選択タグについても同じことが言えます。 IEがコントロールのためのCSSテーマを見つけられなくなると、コントロールに「デフォルトのWindowsテーマ」が適用されます。

Answer 5

fieldset { 
    -moz-border-radius:5px; 
    border-radius: 5px; 
    -webkit-border-radius: 5px; //edit :D 
} 

Answer 6

http://www.webteacher.ws/2010/02/27/style-a-fieldset-with-rounded-corners-using-css/

Answer 7

このサイトでは、フィールドセットはコーナーとIE10を丸めに関する問題が修正されています。 IE（悲しい顔）にはまだ問題があります。時間の100％を稼働させるにはフロートしなければなりません。 WebKitのブラウザ、オペラのためのボーダー半径ため

fieldset { 
 
    margin: 20px; 
 
    padding: 0 10px 10px; 
 
    border: 1px solid #666; 
 
    border-radius: 8px; 
 
    box-shadow: 0 0 10px #666; 
 
    padding-top: 10px; 
 
} 
 
legend { 
 
    padding: 2px 4px; 
 
    background: #fff; 
 
    /* For better legibility against the box-shadow */ 
 
} 
 
fieldset > legend { 
 
    float: left; 
 
    margin-top: -20px; 
 
} 
 
fieldset > legend + * { 
 
    clear: both; 
 
}

<fieldset> 
 
    <legend>Legend</legend> 
 
</fieldset>

http://www.456bereastreet.com/archive/201302/fieldset_legend_border-radius_and_box-shadow/