| <html> | |
| <head> | |
| <style> | |
| #scroll { | |
| width: 230px; | |
| height: 230px; | |
| overflow: scroll; | |
| border: 1px solid black; | |
| } | |
| #container { | |
| width:200px; | |
| height:200px; | |
| background-color:blue; | |
| -webkit-transform: rotate(180deg); | |
| } | |
| #spill { | |
| width:100px; | |
| height:100px; | |
| background-color:green; | |
| position:absolute; | |
| top:-50px; | |
| } | |
| </style> | |
| </head> | |
| <body> | |
| <p id="result"> | |
| FAIL. The transform has not been applied to the scrollHeight. | |
| </p> | |
| <div id="scroll"> | |
| <div id="container"> | |
| <div id="spill"></div> | |
| </div> | |
| </div> | |
| <script> | |
| if (window.layoutTestController) | |
| layoutTestController.dumpAsText(); | |
| var scroll = document.getElementById("scroll"); | |
| var scrollHeight = scroll.scrollHeight; | |
| if (scrollHeight > 215) { | |
| var result = document.getElementById("result"); | |
| result.innerHTML = "SUCCESS! The transform was applied to the scrollHeight!"; | |
| } | |
| </script> | |
| </body> | |
| </html> |