| <!DOCTYPE HTML> |
| <style> |
| #positionedScroll { |
| position: absolute; |
| left: 100px; |
| top: 50px; |
| width: 400px; |
| height: 300px; |
| overflow: scroll; |
| } |
| |
| .bloat { |
| height: 10000px; |
| } |
| |
| .fixed { |
| position: fixed; |
| left: 200px; |
| top: 150px; |
| width: 100px; |
| height: 100px; |
| |
| overflow: hidden; |
| } |
| |
| #transformedScroll { |
| transform: scaleX(2); |
| width: 400px; |
| height: 300px; |
| overflow: scroll; |
| } |
| </style> |
| <div id="positionedScroll"> |
| <div class="bloat"></div> |
| <div class="fixed" id="target1"> |
| <div class="bloat"></div> |
| </div> |
| </div> |
| <div id="transformedScroll"> |
| <div class="bloat"></div> |
| <div class="fixed" id="target2"> |
| <div class="bloat"></div> |
| </div> |
| </div> |
| This test verifies fixed-position elements correctly skip scrolling and adhere to transformed container. |
