| <!DOCTYPE html> |
| <link rel="author" href="mailto:atotic@google.com"> |
| <link rel="help" href="https://drafts.csswg.org/css-ui-3/#outline-props"> |
| <link rel="help" href="https://crbug.com/968019"> |
| <link rel="match" href="outline-focus-layer-ref.html"> |
| <meta name="assert" content="Outline is displayed correctly on children with paint layers"> |
| <style> |
| body { |
| margin: 50px; |
| font-size: 0; |
| } |
| .outline { |
| outline-style: auto; |
| } |
| #container { |
| position: relative; |
| width: 200px; |
| height: 200px; |
| } |
| #target { |
| display: inline-block; |
| width: 100px; |
| height: 100px; |
| background: #EEE; |
| transform: translate(120px, 120px); |
| } |
| .spacer { |
| display: inline-block; |
| height: 50px; |
| width: 200px; |
| } |
| </style> |
| <!-- target outline should be painted as part of container outline --> |
| <div id="container" class="outline"> |
| <span class="spacer"></span> |
| <span id="target"></span> |
| </div> |