page-selectors-002.xht (1427B)
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>CSS Test: Page Selectors: first, right, and left pages</title> 5 <link rel="author" title="Melinda Grant" href="mailto:melinda.grant@hp.com" /> 6 <link rel="help" href="http://www.w3.org/TR/CSS21/page.html#page-selectors" /> 7 <link rel="help" href="http://www.w3.org/TR/css3-page/#left-right-first" /> 8 <meta name="flags" content="paged" /> 9 <meta name="assert" content="In CSS 2.1, page selectors may designate the first page, all left pages, or all right pages." /> 10 <style type="text/css"> 11 12 @page :first { 13 margin-top: 50%; 14 } 15 @page :right { 16 margin-left: 50%; 17 } 18 @page :left { 19 margin-right: 50%; 20 } 21 div { 22 page-break-after: always; 23 } 24 25 </style> 26 </head> 27 <body> 28 <div> 29 This test produces 5 pages on paged media. On this first page, all content is 30 within the bottom right quadrant of the page. 31 </div> 32 <div> 33 On this second page, all content is on the left side of the page. 34 </div> 35 <div> 36 On this third page, all content is on the right half of the page. 37 </div> 38 <div> 39 On this fourth page, all content is on the left side of the page. 40 </div> 41 <div> 42 On this fifth and last page, all content is on the right side of the page. 43 </div> 44 </body> 45 </html>