1 <!DOCTYPE html>
2 <html lang="en"><head><meta charset="utf-8">
3 <title>CSS-UI test: outline & border-radius</title>
4 <link href="http://florian.rivoal.net" rel="author" title="Florian Rivoal">
5 <meta content="should" name="flags">
6 <meta content="To the extent that the outline follows the border edge, it should follow the border-radius curve." name="assert">
7 <link href="reference/ref-filled-green-100px-square.htm" rel="match">
8 <link href="https://drafts.csswg.org/css-ui-3/#outline-props" rel="help">
9 <style>
10 body > div {
11 width: 100px;
12 height: 100px;
13 background: red;
14 border-radius: 100%;
15 display: table-cell; /* Make a BFC */
16 }
17 div > div {
18 width: 50px;
19 height: 50px;
20 margin: 25px;
21 background: green;
22 border-radius: 100%;
23 outline: solid green 25px;
24 }
25 </style>
26
27 </head><body><p>Test passes if there is a filled green square and <strong>no red</strong>.</p>
28 <div><div></div></div>
29
30 </body></html>