Example ActionMenu markup with `<span>` tags

action-menu-spans.html

<action-menu data-anchor-align="end" data-anchor-side="outside-bottom">
  <button role="button" aria-haspopup="true" aria-expanded="true" aria-controls="unique-id-list" id="unique-id-text" aria-label="GIF options" type="button" class="btn-octicon">
    <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" class="octicon octicon-kebab-horizontal">
      <path d="M8 9a1.5 1.5 0 100-3 1.5 1.5 0 000 3zM1.5 9a1.5 1.5 0 100-3 1.5 1.5 0 000 3zm13 0a1.5 1.5 0 100-3 1.5 1.5 0 000 3z"></path>
    </svg>
  </button>
  <span class="Overlay-backdrop--anchor" data-menu-overlay>
    <span class="Overlay Overlay-whenNarrow Overlay--height-auto Overlay--width-auto" hidden>
      <span class="Overlay-body Overlay-body--paddingNone">
        <span class="ActionList" id="unique-id-list" role="menu" aria-labelledby="unique-id-text" style="display: block">
          <span role="none" class="ActionList-item" style="display: list-item">
            <button type="button" onclick="() => {}" role="menuitem" tabindex="0" class="ActionList-content">
              <span class="ActionList-item-label">Play/Pause</span>
            </button>
          </span>
          <span role="none" class="ActionList-item" style="display: list-item">
            <a href="https://www.google.com" role="menuitem" tabindex="-1" class="ActionList-content">
              <span class="ActionList-item-label">Open in new window</span>
            </a>
          </span>
        </span>
      </span>
    </span>
  </span>
</action-menu>