Anchor links not working in Mozilla Firefox 1

[Zhris]

I am making the last finishing touches to a website i've been working on in the last couple of weeks and I noticed that a group of anchor links do not work in MF, although work fine in IE.

I have tried a number of methods to fix this issue, however with no luck. One method I tried was go to the webpage, copy and paste the source code and save it as a new .htm file (note that the live page is written in PHP). I tested it in MF and it worked perfectly therefore I expected it to possibly be a PHP issue! Note that to keep anchor names from producing a gap above each h3 title in IE 8.0 I used display:none; in the stylesheet.

If you would like to view the webpage its located at:

http://ueapride.co.uk/committee.php

If you hover over the top Committee link the anchor links drop down.

The xhtml seems fine to me?

<LI CLASS="Menu_Category MC_First"><A HREF="committee.php#Alex">Alex</A></LI>

<a class="anchor" name="Alex"></a><h3>Alex Dalligan:</h3>

Thank you,

Chris

 

[Vragabond]

The (X)HTML you're using is deprecated. You should be using id attribute instead of name. Furthermore, you don't even need the extra anchor element -- you can give id to any element in the page. So just give it to the most applicable one.

In addition to that, you should note:

1. That XHTML syntax does not permit uppercase tag and attribute names.
2. IE8 is beta and could be massively changed before it is available to larger audiences.
3. If all you need for a link is to jump to an anchor on a current page, there is no need to include the page name in the actual link. The hash and anchor name will suffice, e.g.

<li class="Menu_Category MC_First"><a href="#Alex">Alex</a></li>

___________________________________________________________
[small]Do something about world cancer today: Comprehensive cancer control information at PACT[/small]

 

[Zhris]

Thanks, I will try anchoring using an ID.

I have only used uppercase to make the top links stand out, the rest is in lower case, but ill be sure to change it. If I use an ID of an existing div then IE8 won't be an issue. I wouldn't usually include the page name however, the anchor links can be clicked on from every page on the website (from a drop down menu).

Thanks again,

Chris

 

[Vragabond]

Actually, I just checked your website again and noticed that it doesn't work in FF because you're pointing to an element that does not exist on the website. The thing is, when you set display: none; to an element, that element is no longer rendered anywhere on the page. Therefore, browser cannot point to it.

If you remove the display: none; from the anchors, the code works perfectly. That's where supporting unfinished browsers gets you -- code doesn't work on finished ones.

___________________________________________________________
[small]Do something about world cancer today: Comprehensive cancer control information at PACT[/small]

 

[Zhris]

I changed a couple of things and the same problem occurs.

in Committee.php there is a require tag which prints the main content of the page (This is for content management purposes).

<?php		
require 'php/middle_committee.php';
?>

This is where each committee member table is located > /php/middle_committee.php >. Could the structure of pages effect anchors, although I can't see this being a problem in this case?

<li_class="Menu_Category MC_First"><a href="committee.php#Alex">Alex</a></lo>

<a class="anchor" id="Alex"></a><h3>Alex Dalligan:</h3>

Thanks

 

[Vragabond]

You haven't removed display: none; from the anchors. As long as the anchors are not displayed on the page, browser cannot know where to scroll the page to. If you put the id on h3 element instead of the anchor or remove the display: none; from .anchor, the page will work as intended. This is the only thing that affects your problem.

___________________________________________________________
[small]Do something about world cancer today: Comprehensive cancer control information at PACT[/small]

 

[Zhris]

Vraga,

I'm so sorry, I didn't see your reply in between. I've done exactly as you said and its working fine now. Thank you very much for your help, much appreciated.

<li_class="Menu_Category MC_First"><a href="committee.php#Alex">Alex</a></li>

<h3 id="Alex">Alex Dalligan:</h3>

Chris