Problems with Internet Explorer 7

Hi Mike

Thanks for the kind words and also for the bug report.

I tried to re-create such behaviour with IE7 but couldn't quite pinpoint the same behaviour what you are seeing. Is the site you experience this with public? Can you post the url either here or to me privately http://drupal.org/user/60440

I remember a long time ago when IE would go to the top of the page when you had a link pointing to an anchor that doesn't exist. But IE7 doesn't do that anymore so I have no clue why it would do this.

henrik

This seems to be a weird css or javascript problem in the reporter's site and not reproducible on other footnote pages.

Hi guys,

Here is an example URL:
http://www.cai.org/bible-studies/johannes-kepler

Note that in IE7 you can use the text of the footnotes at the bottom to jump back up to the relevant reference point, but you can't use the reference point in the text to jump down to the footnote text.

So why the difference? Check out this example from the source - reference:
<a class="see_footnote" id="footnoteref11_ub2w93c" title="ibid. (inside front cover)" href="#footnote11_ub2w93c">11</a>

text:
<li><a class="footnote" name="footnote11_ub2w93c" href="#footnoteref11_ub2w93c">11.</a> ibid. (inside front cover)</li>

The reference is using the id attribute whereas the footnote text is using the name attribute! I'm guessing that name doesn't work properly in IE7. Therefore I suggest to use the id reference in both points and scrap the name attribute. In any case both links should really use the same attribute... that would make sense.

Hi fletchgqc:

I noticed the same thing when looking into this. However, that is not the problem, as you can easily verify by creating a simple test page and clicking through the links with IE7. It works just fine.

I agree that Footnotes should be consequent in its use of name vs id. And it should use id (I believe using name is even deprecated?). I intend to fix that the next time I'm working with it. But it is not the cause of the bug here.

Any guess as to what's causing the problem, then? I'm experiencing the exact same thing in IE 7 here: http://consensualdemocracy.foxartshosting.com/. I created a test page here http://consensualdemocracy.foxartshosting.com/node/24 where the footnotes work just fine, but on any of the book pages (http://consensualdemocracy.foxartshosting.com/who-are-guardians/ for example) the footnote links won't go to their notes at the bottom of the page. Exactly like on fletchgqc's example.

It's definitely a weird problem. I'm going through one of the trouble pages piece-by-piece to see if there's something there that's screwing things up.

Ok, so let's give this bug some more attention...

Those of you experiencing this, could you

1) try to actually change the
<li><a class="footnote" name="footnote11_ub2w93c" href="#footnoteref11_ub2w93c">11.</a> ibid. (inside front cover)</li>

to

<li><a class="footnote" id="footnote11_ub2w93c" href="#footnoteref11_ub2w93c">11.</a> ibid. (inside front cover)</li>

and see if it helps? (This should be easy to do in the footnotes.module file by hand, just search for "name=".)

It would be really nice if someone can verify whether that fixes it. I'm on Linux - plus traveling a lot - so getting access to IE7 is not straightforward, let alone setting up a Drupal environemnt on Windows.

The real issue is probably some IE7 that results from some combination of Footnotes and another module or some JavaScript or CSS used in Drupal. To find out what is causing it, one should just remove things from the page header one thing at a time, until problem goes away. But if changing name= to id= helps, then that is all we need to find out.

I'll give that a try and see what happens. Oddly, I created a test page as suggested (see previous post for URL) and the footnotes work fine. I don't think there are any specific modules or scripts on the test page that are not used on the problem book pages.

Thanks! I'll post here with my results. If only everyone would use Firefox or Opera or Safari or...

Never mind... I found it. It's title=, not name= (see post below).

OK, I did find in footnotes.module "title=" which seemed similar enough to "name=" so I changed it to "id=". The footnotes still work fine in every browser but... wait for it... IE 7.

I really don't know what else on the site could be causing the problem. This site is using really minimal modules and javascript, and there just isn't anything else on these pages that should be affecting anything.

Although I have no real proof, I suspect Footnotes isn't playing nicely with the Path module. As an example, the test node I referenced above was created with the standard Drupal naming convention of /node/24, and the footnotes worked fine in IE 7. Changing the URL via Path to /testpage immediately resulted in the footnote links no longer working in IE 7. Removing the custom path and changing back to /node/24 didn't change anything--still broken.

At this point I need to get this project done, so I'll have to find another way to deal with the footnotes. Too bad, as this is a slick little module that works great in every other browser (except the most widely used one in the world, of course)...

Hi guys,

It seems as I would have found finally a solution to our problem, at least it solved my problem. Please test whether it works for you as well.

In fact hingo himself provided unknowingly the solution. There's a second CSS in case of formatting problems with IE, called footnotes-alternative_layout.css, and if you use this instead of the original, the footnote in the text takes you down right to the bottom, even with the IE7!

So there's obviously something in the last bit of the original CSS that doesn't go to well with the IE7.

So to further analyse, the cause for the problem must be in these lines from the original CSS, as the rest is identical with the alternative:

/* Move the footnote number outside of the margin for footnote text (hanging indent) */
ol.footnotes {
/* This is apparently very needed for the "position: absolute;" below to work correctly*/
position: relative;
}
.footnotes .footnote {
position: absolute;
left: 0px;
z-index: 2;
}

If you take out the position: relative, it's now working with IE7 and Firefox, though the layout is slightly changed. So one would need to have a deeper look into that secion to get the formating 100%, but at least the user is being taken to the right spot, even with IE7!

Hope that helps and points into the right direction!

Mike

That did the trick! Thanks! :)

Hi all

1) So I don't find name= being used in footnotes either. That was in an old version but it seems I have already corrected the inconsistency so now it always uses id=.

2) If you have updated footnotes to the newest version but still have name= attributes in the page when viewed in a browser, this is because Drupal's cache is showing you an old version. You should go to the admin section to clear the cache, or alternatively edit the post and add some whitespace to the end (cahce will now see it as a new version). Having Michael's information now, I doubt this will fix the issue however, you can try of course.

3) Btw, title= does something else (the text visible on mouseover), you may want to change it back.

4) If you can fix it with removing the "position: relative" as described above, then this seems to be a simple CSS related bug in IE7. I will leave this bug open for a while, while I decide whether I will fix it or not. (Removing "position: relative" is not a real fix as the footnote numbers float outside of your margin, theoretically they can even flow outside of your visible page with this.)

5) Using footnotes-alternative_layout.css can be considered an official IE workaround, since it fixes other IE CSS issues already. (Another reason I'm unlikely to do any code changes.)

Thanks to Michael for finding out what the bug was!