mozilla

Compare Revisions

border-radius

Change Revisions

Revision 36287:

Revision 36287 by teoli on

Revision 36288:

Revision 36288 by teoli on

Title:
border-radius
border-radius
Slug:
CSS/border-radius
CSS/border-radius
Tags:
css, "CSS Reference", CSS3, css3-background, NeedsMobileBrowserCompatibility
css, "CSS Reference", CSS3, css3-background, NeedsMobileBrowserCompatibility
Content:

Revision 36287
Revision 36288
t48    <pre class="syntaxbox">t48    <pre class="eval syntaxbox" style="border:1px solid #cccccc;b
 >order-bottom: none; margin-bottom:0;background-color:#ffe;border-
 >top-right-radius:1em;border-top-left-radius:1em;">
49border-radius:   &lt;border-radius&gt;{1,4} [ / &lt;border-radius49Formal grammar: [ <var>&lt;length&gt;</var> | <var>&lt;percentage
>&gt;{1,4}]?>&gt;</var> ]{1,4}  [ / [ <var>&lt;length&gt;</var> | <var>&lt;per
 >centage&gt;</var> ]{1,4}] ? 
50                \------------------------------/      \----------
 >---------------------/
51                           First radii                     Second
 > radii (optional)
52</pre>
53    <pre style="border:1px solid #cccccc;border-bottom-right-radi
 >us:1em;border-bottom-left-radius:1em;border-top:none;margin-top:0
 >;">
54<strong>The syntax of the first radius allows one to four values:
 ></strong>
55border-radius: <em>radius</em>             
56border-radius: <em>top-left-and-bottom-right</em> <em>top-right-a
 >nd-bottom-left</em> 
57border-radius: <em>top-left</em> <em>top-right-and-bottom-left</e
 >m> <em>bottom-right</em> 
58border-radius: <em>top-left</em> <em>top-right</em> <em>bottom-ri
 >ght</em> <em>bottom-right</em> 
59 
60<strong>The syntax of the second radius also allows one to four v
 >alues</strong>
61border-radius: (first radius values) / <em>radius</em>           
 >  
62border-radius: (first radius values) / <em>top-left-and-bottom-ri
 >ght</em> <em>top-right-and-bottom-left</em> 
63border-radius: (first radius values) / <em>top-left</em> <em>top-
 >right-and-bottom-left</em> <em>bottom-right</em> 
64border-radius: (first radius values) / <em>top-left</em> <em>top-
 >right</em> <em>bottom-right</em> <em>bottom-right</em> 
65 
66border-radius: inherit

Back to History