1 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
2 <html xmlns="http://www.w3.org/1999/xhtml"><head>
3 <title>CSS Test: 'Border-radius' shorthand is used to set all four 'border-[*]-radius' properties.</title>
4 <link href="http://www.microsoft.com/" rel="author" title="Microsoft">
5 <link href="http://www.w3.org/TR/css3-background/#border-radius" rel="help">
6 <meta content="" name="flags">
7 <meta content="'Border-radius' shorthand sets all four 'border-[*]-radius' properties." name="assert">
8 <style type="text/css">
9 div
10 {
11 width: 200px;
12 height: 200px;
13 }
14 #reference1
15 {
16 border: 10px solid red;
17 border-top-left-radius: 40px;
18 border-top-right-radius: 40px;
19 border-bottom-right-radius: 40px;
20 border-bottom-left-radius: 40px;
21 }
22 #test1
23 {
24 margin-top: -220px;
25 border: 10px solid black;
26 border-radius : 40px;
27 }
28 #reference2
29 {
30 border: 10px solid red;
31 border-top-left-radius: 2em 0.5em;
32 border-top-right-radius: 1em 3em;
33 border-bottom-right-radius: 4em 0.5em;
34 border-bottom-left-radius: 1em 3em;
35 }
36 #test2
37 {
38 margin-top: -220px;
39 border: 10px solid black;
40 border-radius: 2em 1em 4em / 0.5em 3em;
41 }
42 </style>
43 </head>
44 <body>
45 <p>Test passes if there are two black boxes with rounded corners and red is not visible on the page.</p>
46 <table>
47 <tbody><tr>
48 <td>
49 <div id="reference1"></div>
50 <div id="test1"></div>
51 </td>
52 <td>
53 <div id="reference2"></div>
54 <div id="test2"></div>
55 </td>
56 </tr>
57 </tbody></table>
58
59 </body></html>