page-selectors-003.xht (1401B)
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 cascade (right/left)</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/#cascading-and-page-context" /> 8 <meta name="flags" content="paged" /> 9 <meta name="assert" content="Properties specified in a :left or :right @page rule override those specified in an @page rule that has no pseudo-class specified." /> 10 <style type="text/css"> 11 12 @page { 13 margin: 15%; 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 border: medium solid blue; 24 padding: 10px; 25 } 26 27 </style> 28 </head> 29 <body> 30 <div> 31 This test produces three pages on paged media.<br/> 32 All text on this page is inside a box with a blue border which is entirely on the right side of the page. 33 </div> 34 <div> 35 This text is inside a box with a blue border which is entirely on the left side of the page. 36 </div> 37 <div> 38 This text is again inside a box with a blue border which is entirely on the right side of the page. 39 </div> 40 </body> 41 </html>