htmlcssanchorfootnotes

Link multiple references to the same footnote (HTML)


I've got an HTML page that has multiple footnote references that need to go to the same footnote at the bottom of the page. That is, I want 1 and 4 in body content to both link to the same block of text at the bottom.

Most footnote markup is a series of anchor links tied to ids, but by definition they relate one-to-one. Is it possible to do a one-to-many link in HTML somehow?


Solution

  • You can have a many-to-one relationship with anchor links and IDs.

    That is, you can only have one instance of each ID, but you can have multiple links pointing to one ID.

    <p><a href="#footnote-1">This will go to footnote 1.</a></p>
    <p><a href="#footnote-1">This will also go to footnote 1.</a></p>
    <p><a href="#footnote-2">This will go to footnote 2.</a></p>
    
    <footer>
      <p id="footnote-1">[1] A footnote.</p>
      <p id="footnote-2">[2] Another footnote.</p>
    </footer>