backplate-bg-image-003.html (949B)
1 <!DOCTYPE html> 2 <head> 3 <link rel="stylesheet" type="text/css" href="ahem.css" /> 4 <title>Inline, relatively positioned backplate items should be drawn cooperatively with other backplates on the same line. Inline-block, relatively positioned backplate items should be drawn over other backplates on the same line. Absolutely positioned backplate items should be drawn over other page content.</title> 5 <style> 6 body { 7 font: 20px Ahem; 8 } 9 .std { 10 border: 1px solid black; 11 padding: 15px; 12 } 13 .relpos { 14 position: relative; 15 left: 40px; 16 } 17 .i { 18 display: inline; 19 } 20 .ib { 21 display: inline-block; 22 } 23 .abspos { 24 position: absolute; 25 top: 0; 26 left: 0; 27 z-index: 999; 28 } 29 </style> 30 </head> 31 <body> 32 <div><span class="std relpos i">ppppp ppppp</span>ppppp ppppp</div> 33 <div><br><br><span class="std relpos ib">ppppp ppppp</span> 34 <span>ppppp ppppp</span></div> 35 <div class="abspos">ppppp ppppp</div> 36 </body>