content-visibility-025-ref.html (1188B)
1 <!doctype HTML> 2 <html> 3 <meta charset="utf8"> 4 <title>Content Visibility: hidden svg (reference)</title> 5 <link rel="author" title="Vladimir Levin" href="mailto:vmpstr@chromium.org"> 6 <link rel="help" href="https://drafts.csswg.org/css-contain/#content-visibility"> 7 8 <style> 9 div { 10 background: blue; 11 color: white; 12 } 13 svg { 14 border: 1px solid black; 15 background: lightblue; 16 } 17 </style> 18 19 <div>Test passes if there are circles in the light blue box below.</div> 20 <svg xmlns="http://www.w3.org/2000/svg" width="400" height="300" viewBox="0 0 400 300"> 21 <g stroke-width="10" transform="translate(-30)"> 22 <circle cx="80" cy="50" r="35" fill="#084" stroke="none"/> 23 <circle cx="80" cy="50" r="20" fill="#080" stroke="#FF0"/> 24 <circle cx="80" cy="120" r="35" fill="#004" stroke="none"/> 25 <circle cx="80" cy="120" r="20" fill="#080" stroke="#FF0"/> 26 <circle cx="80" cy="190" r="35" fill="#088" stroke="none"/> 27 <circle cx="80" cy="190" r="20" fill="#080" stroke="#FF0"/> 28 <circle cx="80" cy="260" r="35" fill="#008" stroke="none"/> 29 <circle cx="80" cy="260" r="20" fill="#080" stroke="#FF0"/> 30 </g> 31 </svg> 32 <div>Lorem ipsum consectetur adipiscing elit</div>