IE difficulties: link targets

Tuesday 18 November 2003

I’ve been screwing around with the behind the scenes stuff on this site, and a few things about IE caused me some head-scratching. Maybe a reader out there knows an answer. One of the problems is link targets.

The archive links to old blog content (for example, at the bottom of the main blog page) weren’t working properly in IE6. They would navigate to the proper page, but the fragment identifier (you know, the part after the hash mark) wasn’t scrolling the page to the proper place. The HTML for a blog entry looked like this (slightly simplified!):

<div class="blog-entry" id="e20031118T071446">
  <div class="head">
    <h3 id="h_A_sufficiently_large_program" class="title">
      <a href="/blog/200311/a_sufficiently_large_program.html">

IE wouldn’t use the id attribute of the div as a link target. Why not? Changing the HTML to this fixed the problem:

<div class="blog-entry">
  <div class="head">
    <h3 id="h_A_sufficiently_large_program" class="title">
      <a href="/blog/200311/a_sufficiently_large_program.html" name="e20031118T071446">

Anyone know why IE6 won’t jump to <div id=’‘> tags?


I've seen this mentioned before, but I don't remember which of the many web design blogs I saw it on.

IIRC, it's a bug of omission in the HTML specs; they only spec'ed that you can browse to the name of an anchor, not to arbitrary elements. IE implements this, while Mozilla (and others?) are more relaxed.

The safe thing to do is what you've done; put the id on an anchor element. A common use in archive pages is to wrap an anchor (with no href attribute) around the entry title. MovableType's default templates put the anchor by itself at the top of the entry body.

Add a comment:

Ignore this:
Leave this empty:
Name is required. Either email or web are required. Email won't be displayed and I won't spam you. Your web site won't be indexed by search engines.
Don't put anything here:
Leave this empty:
Comment text is Markdown.