border-image-space-001.html (1039B)
1 <!DOCTYPE html> 2 <html> 3 <!-- Submitted from TestTWF Paris --> 4 <head> 5 <title>CSS Test: Border Image: box with spaced repeating border image</title> 6 <link rel="author" title="Levi Weintraub" href="mailto:leviw@chromium.org"> 7 <link rel="help" href="http://www.w3.org/TR/css3-background/#the-border-image-repeat"> 8 <meta name="assert" content="border-image-repeat: space property spaces out background image that doesn't fit an even number of times."> 9 <meta name="fuzzy" content="maxDifference=0-80; totalPixels=0-3850"> 10 <link rel="match" href="reference/border-image-space-001-ref.html"> 11 <style> 12 .borderContainer { 13 width: 108px; 14 height: 108px; 15 border-image: url('support/border.png') 27; 16 background-color: green; 17 border-image-repeat: space; 18 border-image-width: 20px; 19 } 20 </style> 21 </head> 22 <body> 23 <p>There should be a green box below with red diamonds in the corners, and three yellow diamonds evenly spaced 24 apart along the edges.</p> 25 <div class="borderContainer"> 26 </div> 27 </body> 28 </html>