use-descendant-combinator-002.html (828B)
1 <!doctype html> 2 <meta charset=utf-8> 3 <title>CSS Test: use element doesn't cross shadow tree boundaries in selector-matching</title> 4 <link rel="author" title="Emilio Cobos Álvarez" href="mailto:emilio@crisal.io"> 5 <link rel="help" href="https://svgwg.org/svg2-draft/struct.html#UseElement"> 6 <link rel="match" href="/svg/linking/reftests/use-descendant-combinator-ref.html"> 7 <style> 8 #test rect { 9 stroke: red; 10 stroke-width: 10px; 11 } 12 .inside-use rect { 13 fill: green; 14 } 15 </style> 16 <p> 17 You should see a green square, and no red. 18 </p> 19 <svg 20 version="1.1" 21 xmlns="http://www.w3.org/2000/svg" 22 xmlns:xlink="http://www.w3.org/1999/xlink"> 23 <defs> 24 <g id="square"> 25 <g class="inside-use"> 26 <rect width="100" height="100"/> 27 </g> 28 </g> 29 </defs> 30 <g id="test"> 31 <use xlink:href="#square" /> 32 </g> 33 </svg>