Home | History | Annotate | Download | only in scrollbars 
      1 <!DOCTYPE html>
      2 
      3 <html>
      4 <head>
      5     <style>
      6     .scroll {
      7         width: 200px;
      8         height: 200px;
      9         border: 1px solid black;
     10         margin: 15px;
     11         padding: 5px;
     12         overflow-y: scroll;
     13         -webkit-transform: translateZ(0);
     14         box-shadow: 0 0 15px black;
     15     }
     16 
     17     .rotated {
     18         -webkit-transform: rotate3d(0, 0, 1, 45deg);
     19     }
     20     .scroll > div {
     21         background-color: silver;
     22         width: 500px;
     23         height: 1000px;
     24     }
     25     </style>
     26 </head>
     27 <body>
     28 
     29     <p>Overlay scrollbars (on Mac) should show in the correct place when scrolling.</p>
     30     <div class="scroll">
     31         <div></div>
     32     </div>
     33 
     34     <p>Overlay scrollbars (on Mac) should show in the correct place when scrolling, and the resize corner should show in the correct place.</p>
     35     <div class="scroll" style="resize: both; overflow:hiddens">
     36         <div></div>
     37     </div>
     38 
     39     <p>Overlay scrollbars (on Mac) should show in the correct place when scrolling, and the resize corner should show in the correct place.</p>
     40     <div class="rotated scroll" style="resize: both; overflow:hiddens">
     41         <div></div>
     42     </div>
     43 
     44 </body>
     45 </html>
     46