| <style> |
| #scroller { |
| overflow: scroll; |
| width: 200px; |
| height: 200px; |
| box-sizing: border-box; |
| } |
| |
| #scroller-outline { |
| will-change: transform; |
| outline: 5px solid rgba(0, 255, 0, 0.6); |
| outline-offset: -4px; |
| position: absolute; |
| width: 200px; |
| height: 200px; |
| } |
| |
| .spacer { |
| width: 300px; |
| height: 300px; |
| } |
| </style> |
| <!-- #scroller outline should not be covered up by scrolling content background. |
| It is achieved by painting the outline into the decoration layer which draws |
| on top of all other layers. --> |
| <div id="scroller-outline"></div> |
| <div id="scroller"> |
| <div class="spacer"></div> |
| </div> |
| |