Add anchor attribute

source

@@ -4012,8 +4012,13 @@ a.setAttribute('href', 'https://example.com/'); // change the content attribute
      <li><dfn data-x-href="https://drafts.csswg.org/css-contain/#containment-layout">layout
      containment</dfn></li>
     </ul>
-   </dd>
 
+    <p>The following terms are defined in <cite>CSS Anchor Positioning</cite>: <ref spec=CSSANCHOR></p>
+
+    <ul class="brief">
+     <li><dfn data-x-href="https://drafts.csswg.org/css-anchor-1/#implicit-anchor-element">implicit anchor element</dfn></li>
+    </ul>
+   </dd>
 
    <dt>Intersection Observer</dt>
 
@@ -11529,6 +11534,8 @@ interface <dfn interface>HTMLElement</dfn> : <span>Element</span> {
   undefined <span data-x="dom-hidePopover">hidePopover</span>();
   undefined <span data-x="dom-togglePopover">togglePopover</span>(optional boolean force);
   [<span>CEReactions</span>] attribute DOMString? <span data-x="dom-popover">popover</span>;
+
+  [<span>CEReactions</span>] attribute Element? <span data-x="dom-anchorElement">anchorElement</span>;
 };
 
 <span>HTMLElement</span> includes <span>GlobalEventHandlers</span>;
@@ -12763,6 +12770,7 @@ https://software.hixie.ch/utilities/js/live-dom-viewer/?%3C%21DOCTYPE%20HTML%3E%
 
   <ul class="brief">
    <li><code data-x="attr-accesskey">accesskey</code></li>
+   <li><code data-x="attr-anchor">anchor</code></li>
    <li><code data-x="attr-autocapitalize">autocapitalize</code></li>
    <li><code data-x="attr-fe-autofocus">autofocus</code></li>
    <li><code data-x="attr-contenteditable">contenteditable</code></li>
@@ -82898,6 +82906,43 @@ dictionary <dfn dictionary>ToggleEventInit</dfn> : <span>EventInit</span> {
   data-x="popover-showing-state">showing</span>; otherwise "<code data-x="">open</code>".</p>
 
 
+  <h4>The <code data-x="attr-anchor">anchor</code> attribute</h4>
+
+  <p>All <span>HTML elements</span> may have the <dfn element-attr for="html-global"><code
+  data-x="attr-anchor">anchor</code></dfn> attribute set. If specified, the <code
+  data-x="attr-anchor">anchor</code> attribute value must be the <span data-x="concept-ID">ID</span>
+  of another element in the same <span>tree</span> as the element with the <code
+  data-x="attr-anchor">anchor</code> attribute. The other element is considered to be the
+  <span>implicit anchor element</span> of the element with the <code
+  data-x="attr-anchor">anchor</code> attribute.</p>
+
+  <p>The <dfn data-x="dom-anchorElement"><code>anchorElement</code></dfn> IDL attribute must
+  <span>reflect</span> the <code data-x="attr-anchor">anchor</code> attribute.
+
+  <div class="example">
+   <p>The following example shows how to use CSS anchor positioning by using the <code
+   data-x="attr-anchor">anchor</code> attribute without the need for the <code
+   data-x="">anchor-name</code> CSS property:</p>
+
+   <pre><code class="html">&lt;div id="myanchor">myanchor&lt;/div>
+&lt;div id="target" anchor="myanchor">target&lt;/div>
+
+&lt;style>
+#myanchor {
+  margin: 100px;
+  width: 100px;
+  height: 100px;
+}
+#target {
+  position: absolute;
+  left: anchor(left);
+  top: anchor(bottom);
+  width: 100px;
+  height: 100px;
+}
+&lt;/style></code></pre>
+  </div>
+
   <h2 split-filename="browsers" id="browsers">Loading web pages</h2>
 
   <div w-nodev>
@@ -130677,6 +130722,11 @@ interface <dfn interface>External</dfn> {
           <code data-x="attr-input-alt">input</code>
      <td> Replacement text for use when images are not available
      <td> <a href="#attribute-text">Text</a>*
+    <tr>
+     <th> <code data-x="">anchor</code>
+     <td> <code data-x="attr-anchor">HTML elements</code>
+     <td> Makes the specified element a parent of this element in the popover hierarchy if both elements have the <span data-x="attr-popover">popover</span> attribute
+     <td> Id of the popover parent element
     <tr>
      <th> <code data-x="">as</code>
      <td> <code data-x="attr-link-as">link</code>
@@ -133129,6 +133179,9 @@ INSERT INTERFACES HERE
    <dt id="refsCSSALIGN">[CSSALIGN]</dt>
    <dd><cite><a href="https://w3c.github.io/csswg-drafts/css-align/">CSS Box Alignment</a></cite>, E. Etemad, T. Atkins. W3C.</dd>
 
+   <dt id="refsCSSANCHOR">[CSSANCHOR]</dt>
+   <dd><cite><a href="https://drafts.csswg.org/css-anchor-1/">CSS Anchor Positioning</a></cite>, T. Atkins, J. Tompkins, I. Kilpatrick. W3C.</dd>
+
    <dt id="refsCSSANIMATIONS">[CSSANIMATIONS]</dt>
    <dd><cite><a href="https://w3c.github.io/csswg-drafts/css-animations/">CSS Animations</a></cite>, D. Jackson, D. Hyatt, C. Marrin, S. Galineau, L. Baron. W3C.</dd>