Firefox边框半径不显示

Question

我正在使用以下css

#helper{
position:absolute;
bottom:0;
width:100%;
}

#key{
width:950px;
margin:0 auto;
z-index:2;
-moz-border-radius-topleft:8px;
-moz-border-radius-topright:8px;
}


<-- inside body -->
<div id="helper">
<div id="key">SHould be rounded top corners?</div>
</div>

然而在Firefox中它没有在刷新后显示。我应该先考虑哪些想法？感谢

Answer 1

为#key元素指定背景或边框？

Answer 2

键{

width:950px;
margin:0 auto;
z-index:2;
border:1px solid #000;
background-color:#F00;
-moz-border-radius-topleft:8px;
-moz-border-radius-topright:8px;
}

你应该使用边框或背景。

Answer 3

好问题哈利;

这可能导致我们添加两行。 Firefox 14可能喜欢css中的所有四个角落。

更换2行
-moz-边界半径，左上：8像素;
-moz-边界半径-topright：8像素;

有4行
    边框左上角的半径：18像素;
    边框右上角半径：18像素;
    边框左下角半径：0像素;
    边界右下半径：0像素;

为您的例子：

键

{
宽度：290px;
保证金：0自动;
border：4px solid＃000;
ackground-COLOR：＃EE7621;
    边框左上角的半径：18像素;
    边框右上角半径：18像素;
    边框左下角半径：0像素;
    边框右下角半径：0像素;
    填充：5px 0 0 15px;
}

jsfiddle示例：
http://jsfiddle.net/ccatto/7zAXC/

我们也可以将css用作类和id：http://jsfiddle.net/dFTMh/。

THX;