Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

HTML

Martin Coutts
Martin Coutts
18,154 Points

Linking to id on different page

I am building a relatively simple site and instead of doing a new Contact Us page I just want to link to the #contact section at the bottom of the index.html page from the other pages. It works on the same page using: href="#contact-header".

When I use it on a different page on the same site I am using href="index.html#contact-header". When I click it nothing happens, however if i open the same link in a new tab it takes me straight to the contact section on the other page.

Emmanuel C
Emmanuel C
10,636 Points

Are both pages in the same folder?

3 Answers

Brandon Gormley
Brandon Gormley
6,147 Points

If your Contact Us is on a different page, you must use ../ to go up one level to your index page.

I.E If your index.html is in a folder "Website" and nested in that is another folder which contains the page you are currently working on then you must us ../ to go back to the original (Website) folder. a ref="../index.html#contact-header"

Kuanyshbek Ospanov
Kuanyshbek Ospanov
17,416 Points

Try href="/index.html/#contact-header"

Martin Coutts
Martin Coutts
18,154 Points

Thank you for the feedback guys, figured it out the moment after I posted the question as is normally the case. I had a Javascript function to scroll to the foot of the page of the index when the contact us was clicked and I guess that was interfering. Just wrote a conditional for it to only work on the index.html and seems to have done the trick.

Thank you very much for the help though.