Link anchors in same don't work in all browsers

Question

I had to create some pages for legal docs for a client and I came across this problem. I had to use a lot of id attributes to link to specific sections from inside the page, but none of them is working.

I followed the method as described in w3schools.

So I have the id element <h4 id="a1">Some text</h4> and then I point to it like this <a class="specialLink" href="#a1">Click here</a>

Went through several threads on google and here but didn't help.

Any ideas?

Also here's a link to the website. You can see the anchors in the third tab and you can use the password 'enter' to get in.

Thanks in advance!

Answer 1

The issue has nothing to do with anchors and hyperlinks, those are working fine (though you really should distrust w3schools... http://w3fools.com/ ).

If you copy the content of your tab into a single page all the hyperlinks are working with the markup that is already there.

The real issue is the scrolling control.

You have a container with some custom scrolling controllers (the hint was class="mCSB_scrollTools") that's preventing the page to scroll to the sections which you want to show. Another test that you can do is try to find on the page "Deals;" and (at least in Chrome) you will notice a flicker when the browser tries to display that section and then scrolls (better yet teleports) to the top of the page.

I have close to zero Wordpress experience so, sadly, this is how far I can help you. Maybe you can change some configuration on the scroll box or just use a normal container...

Answer 2

Use <a name="a1">some text</a>