| <!DOCTYPE html> | |
| <p> | |
| This test ensures that CSS outlines (e.g. focus rings) are clipped, even if there is no other visual overflow. | |
| There should be no visible red pixels overlapping or overflowing the green box. | |
| </p> | |
| <style> | |
| div.clip { display: inline-block; overflow: hidden; border: 2px solid green; } | |
| div.outline { display: inline-block; vertical-align: bottom; outline: red solid 5px; width: 100px; height:100px; } | |
| </style> | |
| <div class="clip"><div class="outline"></div></div> |