0

私は次のHTMLを持っています:

<div class="body-content">
    <fieldset class="EntryFieldSet">
        <legend id="ScreeningTitle"> Screening:</legend>
        <br/><br/>
    </fieldset>
</div>

そして、次のCSS :

.body-content {
    width: 300px;
    border: 1px solid black;
    background-color: #F5F5F5 /*whitesmoke*/;
}
.EntryFieldSet {
    width: 250px;
    padding-left: 15px;
    overflow: hidden;
}

jsフィドル

Internet Explorerでは、右側がギザギザになっています

IE

しかし、Chromeでは問題なく表示されます

クロム

すべてのブラウザー/インターネット エクスプローラーで修正するにはどうすればよいですか?

編集- この問題は IE 9 64 ビット版で発生しています

4

3 に答える 3

1

バグを少しだけ改善しました。

 .EntryFieldSet {
        width: 250px;
        padding-left: 15px;
        overflow: hidden;
        border-top-right-radius: 3px;
        -webkit-top-right-radius: 3px;
        -moz-border-top-right-radius: 3px;
        border-top-right-radius: 0px\9;
        border-top-right-radius: 0px\0/;

    }
于 2013-07-29T18:55:56.153 に答える
1

デフォルトのcssを上書きするのが最善の方法だと思います。これが私のために働いたものです

.EntryFieldSet {
   border-radius: 0px;
   -moz-border-radius: 0px;
   border: solid 1px darkgray;
}

このようにして、すべてのブラウザで均一に同じ色で表示されます

jsフィドル

于 2013-09-19T13:17:31.480 に答える
0

フィールドセットにゼロを適用することで、ブラウザのデフォルトでゼロborder-radiusを適用しようとするのをやめさせることができたので、適切にレンダリングされるようになりました

.EntryFieldSet {
    /* other properties */
    -moz-border-radius: 0px;
         border-radius: 0px;
}

jsフィドル

例:

デモ

于 2013-07-29T18:01:54.270 に答える