536061-ref.html (1605B)
1 <!DOCTYPE html> 2 3 <html lang="en"> 4 <head> 5 <meta http-equiv="content-type" content="text/html; charset=utf-8" /> 6 <title>Bugs with transform: rotate() and box-shadow</title> 7 8 <style> 9 body { 10 overflow: hidden; 11 } 12 13 .label { 14 position: absolute; 15 top: 200px; 16 left: 196px; 17 margin: 0; 18 height:16px; 19 width: 300px; 20 box-shadow: 0 0 .7em black; 21 border: 1px black solid; 22 } 23 .vlabel { 24 position: absolute; 25 top: 58px; 26 left: 42px; 27 margin: 0; 28 width: 16px; 29 height: 300px; 30 box-shadow: 0 0 .7em black; 31 border: 1px black solid; 32 } 33 </style> 34 </head> 35 36 <body> 37 38 <p class="label"></p> 39 <p class="label" style="top: 400px; box-shadow:none; outline: 3px dashed blue;"></p> 40 <p class="vlabel" style="box-shadow:none; outline: 3px dashed blue;"></p> 41 <p class="vlabel" style="left:102px; "></p> 42 <p class="vlabel" style="top:454px; box-shadow:none; outline: 3px dashed blue; "></p> 43 <p class="vlabel" style="top:454px; left:102px;"></p> 44 45 <!-- cover a few shadow corners which are a bit different --> 46 <div style="position:absolute; top:40px; left:85px; width:50px; height:50px; background:black; z-index:99;"></div> 47 <div style="position:absolute; top:340px; left:85px; width:50px; height:50px; background:black; z-index:99;"></div> 48 <div style="position:absolute; top:420px; left:85px; width:50px; height:50px; background:black; z-index:99;"></div> 49 <div style="position:absolute; top:730px; left:85px; width:50px; height:50px; background:black; z-index:99;"></div> 50 51 </body> 52 53 </html>