<html>
<link rel="stylesheet" href="josh.css">
<body bgcolor="#FFFFFF">
<div id="Description">
			<table cellpadding="0" cellspacing="0" border="0" width="100%" class="main">
				<tr><td valign="top" class="name">-moz-border-radius</td><td valign="top" nowrap class="compatibility">NN <span class="emphasis">6</span> IE <span class="emphasis">n/a</span> CSS <span class="emphasis">n/a</span></td>
				</tr>
				<tr>
					<td colspan="2" class="divider"><img src="dwres:18084" width="100%" height="1"></td>
				</tr>
				<tr>
					<td valign="top" nowrap class="usage"><p class="literal"></p>
					</td><td valign="top" nowrap class="requirements">Inherited: No</td>
				</tr>
				<tr>
					<td valign="top" colspan="2" class="description"><p>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 <span class="literal">border-radius</span> attribute
value setup.
</p>
					</td>
				</tr>
				<tr>
					<td valign="top" colspan="2" class="CLEARSEPARATION">&nbsp;</td>
				</tr>
				<tr>
					<td valign="top" colspan="2" class="csssyntax"><span class="title">CSS Syntax</span></td>
				</tr>
				<tr>
					<td valign="top" colspan="2" class="CLEARSEPARATION">&nbsp;</td>
				</tr>
				<tr>
					<td><span class="programlisting"><pre>-moz-border-radius: <span class="replaceable">radius</span> {1,4}</pre>
						</span></td>
				</tr>
				<tr>
					<td valign="top" colspan="2" class="CLEARSEPARATION">&nbsp;</td>
				</tr>
				<tr>
					<td valign="top" colspan="2" class="value"><span class="title">Value</span></td>
				</tr>
				<tr>
					<td><p>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
<span class="literal">0%</span> (no rounding) to <span class="literal">50%</span>
(maximum rounding). The rounded border does not crop content of the
element.
</p><p>This attribute accepts one, two, three, or four
<span class="replaceable">radius</span> 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.
</p>
						<table border="1"><tbody><tr><th>Number of values</th><th>Effect</th></tr>
								<tr><td>1</td><td>All four corners set to same value</td>
								</tr>
								<tr><td>2</td><td>Top left and bottom right corners set to the first value, top right
and bottom left corners set to the second value
</td>
								</tr>
								<tr><td>3</td><td>Top left corner set to first value, top right and bottom left corners
set to second value, bottom right corner set to third value
</td>
								</tr>
								<tr><td>4</td><td>Top left, top right, bottom right, and bottom left corners set,
respectively
</td>
								</tr>
							</tbody></table>
					</td>
				</tr>
				<tr>
					<td valign="top" colspan="2" class="CLEARSEPARATION">&nbsp;</td>
				</tr>
				<tr>
					<td valign="top" colspan="2" class="initvalue"><span class="title">Initial Value</span></td>
				</tr>
				<tr>
					<td><p><span class="literal">0</span></p>
					</td>
				</tr>
				<tr>
					<td valign="top" colspan="2" class="CLEARSEPARATION">&nbsp;</td>
				</tr>
				<tr>
					<td valign="top" colspan="2" class="example"><span class="title">Example</span></td>
				</tr>
				<tr>
					<td valign="top" colspan="2" class="CLEARSEPARATION">&nbsp;</td>
				</tr>
				<tr>
					<td><span class="programlisting"><pre>div.hotbox {-moz-border-radius:20px}
div.circle {-moz-border-radius:50%}</pre>
						</span></td>
				</tr>
				<tr>
					<td valign="top" colspan="2" class="CLEARSEPARATION">&nbsp;</td>
				</tr>
				<tr>
					<td valign="top" colspan="2" class="appliesto"><span class="title">Applies To</span></td>
				</tr>
				<tr>
					<td><p>All elements.</p>
					</td>
				</tr>
			</table>
		</div>
</body>
</html>