Opera 10.6是否正确支持fieldsets的border-radius?

时间:2010-08-11 17:38:31

标签: css border opera css3

我试图让border radius属性在Opera 10.6中的字段集上正常工作,但它似乎无法正常工作。

这是html:

<form method="post" action="character.php" class="form">
    <fieldset>
        <legend>Insert</legend>
        <label for="txtCharacter">Character</label>
        <input type="text" id="txtCharacter" name="txtCharacter" />
    </fieldset>
</form>

这是我想要使用的CSS:

.form fieldset {
    background-color:#355e3b;
    margin:0px;
    border:3px solid #635147;

    /* Adds the rounded border effect. */
    -webkit-border-radius:10px;
    -moz-border-radius:10px;
    border-radius:10px;
}

以上在Firefox和Safari中完美运行,为我提供了一个带有所需边框形状/大小/颜色和正确背景颜色的圆角字段集:

Safari http://img827.imageshack.us/img827/8411/safari1.png

Opera为我提供了正确的颜色,但边框是正方形的:

Opera1 http://img37.imageshack.us/img37/2051/opera1r.png

但是,如果我选择指定边框(border:3px solid #635147;)的行,那么Opera会提供一个舍入的字段集,就像它应该的那样:

Opera2 http://img651.imageshack.us/img651/4651/opera2j.png

这里发生了什么?选择边框时,为什么Opera不会显示边框半径?谢谢!

3 个答案:

答案 0 :(得分:1)

这可能是他们渲染引擎中的一个错误。

答案 1 :(得分:1)

rounded corners on input elements in Opera存在一些众所周知的问题,可能是人们发现的解决方法之一,可能会对您的字段集产生影响。

答案 2 :(得分:0)

我正在使用Opera 11.51,而且bug仍然存在。

的CSS:

fieldset {
    moz-border-radius:1.5em;
    border-radius:1.5em;
}

Chrome,Safari,Firefox:正常工作

IE 6至8,Opera 11.51:不起作用(当然,直到IE9才支持)。

相关问题