-moz-border-radiusNN 6 IE n/a CSS n/a

Inherited: No

This is a shortcut attribute that lets you set the radius of one or more border corners. The number of values determines which sides receive the assigned colors. Note that this value arrangement differs from the preliminary CSS3 border-radius attribute value setup.

 
CSS Syntax
 
-moz-border-radius: radius {1,4}
 
Value

A border corner radius can be defined by a length measure, signifying the length of the radius of the imaginary circle from which the rounded corner comes. The larger the value, the more rounded the corner becomes. For screen display, the pixel length unit is most appropriate. You may also use a percentage value in the range between 0% (no rounding) to 50% (maximum rounding). The rounded border does not crop content of the element.

This attribute accepts one, two, three, or four radius values, depending on how many and which corners you want to make round. Value quantities and positions are interpreted as shown in the following table.

Number of valuesEffect
1All four corners set to same value
2Top left and bottom right corners set to the first value, top right and bottom left corners set to the second value
3Top left corner set to first value, top right and bottom left corners set to second value, bottom right corner set to third value
4Top left, top right, bottom right, and bottom left corners set, respectively
 
Initial Value

0

 
Example
 
div.hotbox {-moz-border-radius:20px}
div.circle {-moz-border-radius:50%}
 
Applies To

All elements.