outline-022.html (780B)
1 <!DOCTYPE html> 2 <title>CSS-UI test: outline works on nested spans</title> 3 <link rel="author" href="mailto:atotic@google.com"> 4 <link rel="help" href="https://drafts.csswg.org/css-ui/#outline-props"> 5 <link rel="match" href="../reference/ref-filled-green-100px-square-only.html"> 6 <link rel="stylesheet" type="text/css" href="/fonts/ahem.css" /> 7 <style> 8 body { 9 --outline-width: 10px; 10 --square-width: 80px; 11 } 12 #container { 13 width: var(--square-width); 14 padding: var(--outline-width); 15 } 16 #target { 17 font-family: Ahem; 18 font-size: var(--square-width); 19 outline: solid var(--outline-width) green; 20 color: green; 21 } 22 </style> 23 <p>Test passes if there is a filled green square.</p> 24 <div id="container"> 25 <span> 26 <span> 27 <span id="target">x</span> 28 </span> 29 </span> 30 </div>