Scheduled for removal
From Firefox 88 onwards, the standard outline
property will follow the shape of border-radius
, making -moz-outline-radius
properties redundant. As such, this property will be removed.
In Mozilla applications, the -moz-outline-radius-topright
CSS property can be used to round the top-right corner of an element's outline
.
Syntax
The value of -moz-outline-radius-topright
is either a CSS <length>
or a percentage of the corresponding dimensions of the border box. The calc()
function may be used as well.
Values
<length>
- The radius of the circle defining the curvature of the top and right edges of the element, specified as a CSS
<length>
. <percentage>
- The radius of the circle defining the rounding of the top-right corner of the element, specified as the percentages of the top and right sides of the border box.
Formal definition
Initial value | 0 |
---|---|
Applies to | all elements |
Inherited | no |
Percentages | refer to the corresponding dimension of the border box |
Computed value | as specified |
Animation type | a length, percentage or calc(); |
Formal syntax
<outline-radius>where <outline-radius> = <length> | <percentage>
Examples
HTML
<p>Look at this paragraph's top-right corner.</p>
CSS
p {
margin: 5px;
border: solid cyan;
outline: dotted red;
-moz-outline-radius-topright: 2em;
}
Result
The example above will not display the desired effect if you are viewing this in a browser other than Firefox.
Specifications
Not part of any standard.
Browser compatibility
BCD tables only load in the browser
See also
- See the
-moz-outline-radius
property for more information.