pseudo-element-with-slotted-anchor-ref.html (413B)
1 <!DOCTYPE html> 2 <style> 3 my-anchor { 4 display: block; 5 } 6 7 span { 8 display: block; 9 anchor-name: --anchor; 10 padding: 2rem; 11 background: red; 12 color: white; 13 inline-size: fit-content; 14 } 15 16 my-anchor::after { 17 content: 'target'; 18 position: absolute; 19 position-anchor: --anchor; 20 position-area: bottom center; 21 background: lightblue; 22 padding: 1rem; 23 } 24 </style> 25 <my-anchor> 26 <span>anchor</span> 27 </my-anchor>