Can I Anchor a Div?
By Sara Williams
Anchors have long been used to link to specific parts of Web pages. An anchor consists of a hyperlink created by anchor tags and an element -- headings, paragraphs, images and divs, to name a few examples -- that contains an ID. As long as a div has an ID, it is usable as an anchor.
Uses of Anchors
Anchors are typically used on Web pages that contain large amounts of text. On a Web page that has many sections with sub-headings, you can create a list of links that act as a table of contents. Each link would point to a heading tag or div by its ID. Another use of anchors is to create “jump” links that take the user back to the top of a long Web page, which reduces the need for scrolling. It is also possible to link to a specific part of another page.
Anchoring a Div
Adding an ID to a div will allow you to link to it using “” tags:
The ID is now accessible by anchor tags, style sheets and JavaScript. If you have a div that already contains an ID, you will need to use that ID.
Linking to a Div Anchor
The method for creating a link to an anchored element involves setting the “href” attribute of a pair of “” tags to the ID name, prefixed by a hash symbol:
Go to My Stuff Go to My Stuff on Page 2
The first link will send the user to the element with an ID of “my_stuff,” so long as it is on the same page that is being viewed in the browser. The second link will load a different page in the browser and jump to the “my_stuff” div.
Writer Bio
Sara Williams lives in western New York, where she is a freelance Web designer and content writer. She specializes in Web design, development and computer-hardware topics. Williams holds an Associate of Applied Science in computer information systems.