Firefox frame radius not showing

I use the following 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>

However, in Firefox, it does not appear after the update. Any ideas where I should look first? Thanks

+3
source share
3 answers

Specify a background or border for the #key element?

+4
source

key {

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;
}

you must use a border or background for this.

+1
source

;

, . Firefox 14 css.

2
-moz- --: 8px;
-moz- -topright: 8px;

4
   : 18px;
   : 18px;
   : 0px;
   : 0px;

:

{
: 290px;
margin: 0 auto;
border: 4px solid # 000;
ackground : # EE7621;
   : 18px;
   : 18px;
   : 0px;
   : 0px;
  padding: 5px 0 0 15px;
}

jsfiddle:
http://jsfiddle.net/ccatto/7zAXC/

css id: http://jsfiddle.net/dFTMh/.

;

0
source

Source: https://habr.com/ru/post/1747951/


All Articles