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.
An HTML anchor uses the “” anchor tags to link to any element by its “name” or “ID” attribute. Though “name” was used in the past, use of “ID” is considered a best practice since “name” is now a deprecated -- not current -- attribute in HTML 4 and above. Instead of creating a link that points to a file path, you can create a link pointing to any HTML element's ID or name.
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:
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.
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.