box-offsets-rel-pos-vrl-004-ref.xht (1987B)
1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 2 3 <html xmlns="http://www.w3.org/1999/xhtml"> 4 5 <head> 6 7 <title>CSS Reftest Reference</title> 8 9 <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" /> 10 11 <meta content="image" name="flags" /> 12 13 <style type="text/css"><![CDATA[ 14 div 15 { 16 text-align: right; 17 } 18 19 div > img 20 { 21 margin-left: 1em; 22 margin-right: 8px; 23 } 24 25 table 26 { 27 background-color: yellow; 28 border-spacing: 0px; 29 border: orange solid 50px; 30 display: inline-table; 31 height: 300px; 32 vertical-align: top; 33 width: 300px; 34 } 35 36 td 37 { 38 padding: 0px; 39 } 40 41 td.first-row 42 { 43 height: 29px; 44 vertical-align: top; 45 } 46 47 td#middle-row 48 { 49 text-align: center; 50 } 51 52 td.third-row 53 { 54 height: 25px; 55 } 56 57 span.blue 58 { 59 background-color: blue; 60 color: white; 61 height: 25px; 62 text-align: left; 63 width: 25px; 64 } 65 66 span#top-left, span#bottom-left 67 { 68 float: left; 69 } 70 71 span#top-right, span#bottom-right 72 { 73 float: right; 74 } 75 ]]></style> 76 </head> 77 78 <body> 79 80 <div> 81 <table> 82 <tr><td class="first-row"><span class="blue" id="top-left">TL</span></td><td class="first-row"><span class="blue" id="top-right">TR</span></td></tr> 83 <tr><td id="middle-row" colspan="2"><img src="support/100x100-lime.png" alt="Image download support must be enabled" /></td></tr> 84 <tr><td class="third-row"><span class="blue" id="bottom-left">BL</span></td><td class="third-row"><span class="blue" id="bottom-right">BR</span></td></tr> 85 </table><img src="support/pass-cdts-box-offsets-rel-pos.png" width="304" height="35" alt="Image download support must be enabled" /> 86 87 <!-- 88 The image says: 89 " 90 Test passes if there is a blue square 91 at each corner of the yellow square. 92 " 93 --> 94 </div> 95 96 </body> 97 </html>