379349-1c.xhtml (1705B)
1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> 2 <html xmlns="http://www.w3.org/1999/xhtml"> 3 <head> 4 <title>CSS3 Multi-column Layout Test Suite: Overflow Pagination (Multiple)</title> 5 <link rel="author" title="Elika J. Etemad" href="http://fantasai.inkedblade.net/contact"/> 6 <link rel="help" href="http://www.w3.org/TR/CSS21/visudet.html#the-height-property"/> 7 <link rel="help" href="http://www.w3.org/TR/CSS21/syndata.html#length-units"/> 8 <style type="text/css"> 9 .container { 10 height: 24pt; 11 background: red; 12 } 13 .overflow { 14 height: 5in; 15 border: 2pt silver solid; 16 border-top: none; 17 border-bottom: solid 10px red; 18 } 19 #following { 20 margin: -72pt 0; 21 height: 72pt; 22 background: white; 23 border: 2pt black; 24 border-style: none solid; 25 26 font-size: 10pt; 27 line-height: 10pt; 28 color: blue; 29 } 30 .no2 .overflow { 31 height: 4.66667in; 32 border-bottom-color: blue; 33 } 34 .no3 .overflow { 35 height: 4.33333in; 36 position: relative; 37 z-index: -1; 38 } 39 body { 40 height: 2in; 41 width: 300pt; 42 column-width: 100pt; 43 column-gap: 0; 44 border: solid gray; 45 } 46 </style> 47 </head> 48 <body> 49 <div class="container no1"> 50 <div class="overflow"> 51 </div> 52 </div> 53 <div class="container no2"> 54 <div class="overflow"> 55 </div> 56 </div> 57 <div class="container no3"> 58 <div class="overflow"> 59 </div> 60 </div> 61 <p id="following"> 62 This paragraph must be in the first column. 63 There must be no red. There must be a blue 64 horizontal line in middle of the third 65 column. 66 </p> 67 </body> 68 </html>