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

Posted by Matt Van Dyck
Matt Van Dyck
2,033 Points

Simple HTML question regarding Anchors

Hi there. I don't know why I am having issues here... I am setting anchors on my page and having my nav bar link to them. 2 of the links work, and 2 don't, yet they are set up the same way? http://blueprint.pixelblvd.com/ the work and contact buttons work.

Here is my menu code:

                            <li><a href="#about">About</a></li>
            <li><a href="#work">Work</a></li> 
            <li><a href="#team">Team</a></li>
            <li><a href="#contact">Contact</a></li>

And my Anchors... <a name="about"> <section id="content"></a> 

    <a name="work"><h1>Our Work</h1></a>

    <a name="team"><section id="our-team"></a>

    <a name="contact"><section id="contact-form"></a>

Not sure what the issue is? I realize I am wrapping the h1 tag with the our work section... but that is the only one that works perfectly! The anchor is hovering right above where it says Our Work. I did try changing the tags around all of the h1 tags... but gives me the same result.

4 Answers

George Offley
PLUS
George Offley
Courses Plus Student 7,386 Points
George Offley
George Offley
Courses Plus Student 7,386 Points

Take a look at the anchors and see if they match up, for example take a look at the spelling, punctuation (if any), and if one is capitalized in the nav bar and the corresponding tag is not.

Matt Van Dyck
Matt Van Dyck
2,033 Points

Thank you for the help, however, my anchor text in the menu and in the actual anchor match exactly.... not sure what the problem is :(

George Offley
George Offley
Courses Plus Student 7,386 Points
George Offley
George Offley
Courses Plus Student 7,386 Points

That's odd because when I went to the site and inspected the elements they didn't match.

nik
nik
8,925 Points
nik
nik
8,925 Points

try wrapping your anchors around your H1s for your team and about sections.

nvm what i said.

Matt Van Dyck
Matt Van Dyck
2,033 Points
Matt Van Dyck
Matt Van Dyck
2,033 Points

Interesting. I had <section id> tags before the <h1> tags and if I changed the menu bar anchor links to the section id labels, it worked.

Mike Weber
Mike Weber
2,589 Points
Mike Weber
Mike Weber
2,589 Points

You don't need anchors on the bottom section of code. Try this:

<h1 id="work">Our Work</h1>

<section id="our-team">
    <h? id="team"></h?>
</section>

<section id="contact-form">
    <h? id="contact"></h?>
</section>

The ? in the h tag just merely represents any of the 6 headers you could put there. Just be sure to be semantic. Let me know how this works for you.