1 <!DOCTYPE html>
2 <html><head>
3 <title>CSS Backgrounds and Borders Test: 'border-image' set as 'round' and 'stretch' </title>
4 <link href="mailto:reni2046@gmail.com" rel="author" title="Ren Jing">
5 <link href="http://www.w3.org/TR/css3-background/#border-images" rel="help">
6 <link href="reference/border-image-round-and-stretch-ref.htm" rel="match">
7 <meta content="orange diamonds on top and bottom border should be repeated 12 times, and orange diamonds on left and right border should be stretched, diamonds in corners should be red, and other diamonds should be orange." name="assert">
8 <style type="text/css">
9 .container {
10 border: double red 1em;
11 border-image: url("support/border.png") 27 round stretch;
12 height:77px;
13 width:192px;
14 }
15 </style>
16 </head>
17 <body>
18 <p>The test passes if orange diamonds on top and bottom border repeat 12 times, and orange diamonds on left and right border are stretched, diamonds in corners are red, and other diamonds are orange.</p>
19 <div class="container"></div>
20
21
22 </body></html>