exclusions-wrap-flow-01-ref.xht (1261B)
1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 2 <html xmlns="http://www.w3.org/1999/xhtml"> 3 <head> 4 <title>CSS Test: wrap-flow:none</title> 5 <link rel="author" title="Vincent Hardy, Adobe Systems" href="mailto:vhardy@adobe.com"/> 6 <style> 7 /*<![CDATA[*/ 8 9 #containing-block { 10 position: relative; 11 width: 400px; 12 height: 400px; 13 border: 1px solid #e0e0e0; 14 font-size: 0px; /* collapses the 'strut' on each line, see CSS 2.1 section 10.8.1 */ 15 } 16 17 #top-fragment, #left-fragment, #right-fragment, #bottom-fragment { 18 display: inline-block; 19 background: black; 20 } 21 22 #top-fragment, #bottom-fragment { 23 width: 400px; 24 height: 150px; 25 } 26 27 #left-fragment, #right-fragment { 28 width: 150px; 29 height: 100px; 30 } 31 32 #exclusion { 33 display: inline-block; 34 width: 100px; 35 height: 100px; 36 background: #0f0; 37 } 38 39 40 /*]]>*/ 41 </style> 42 </head> 43 <body> 44 <p>You should see a green square in a solid 400px by 400px black background. You should not see any red background.</p> 45 <div id="containing-block"><div id="top-fragment"></div><div id="left-fragment"></div><div id="exclusion"></div><div id="right-fragment"></div><div id="bottom-fragment"></div></div> 46 </body> 47 </html>