HTML Introduction to HTML and CSS HTML: The Structural Foundation of Web Pages and Applications Anchor Tags

There is an error in the anchor tag section when I apply the a href tag with #top and refresh the page it do

Hello everyone,

I think there is an error in the anchor tag lesson 10:20 am So when I apply the a href tag with #top and refresh the page it does not work probably because is needed a class placed at the top in the head section?

Please let me know

6 Answers

You're welcome. Happy to help! Make sure to ask again if something does not work :)

She 100% does that. Maybe they forgot to show where she writes that in the video. Now your a tag is looking for an element that has an id "top". You want it to go back to the top of the page, so place the id "top" on the element that is on top of the page. For example header.

<header id="top">This is a header</header>

This way, whenever you click that link (a href tag) it will scroll up to the header. Let me know if you got it

Amy Chatas
Amy Chatas
Front End Web Development Techdegree Student 158 Points

Tom Achki I did as you recommended but changed it to:

<header id="top"></header>

When I included the words: This is a header as you indicated...it adds those words at the top of the page. I didn't want to see that so removed the words and still make it to the top of the page.

This is how my code looks like with the a href tag:

 <p><a href="#top"><img src="http://placeimg.com/400/480/people" alt="Drawing of Jane Smith" class="profile-image">This is a third paragraph</a></p>

I haven't placed an ID yet, where shall I place it? She does not do that in the video?

I have placed the id inside the header tag as follows: id="top" and now it is working!

Thanks a bunch Tom!

When you type <a href="#top"></a>, the website looks for an element that has an id "top". Make sure to give the id "top" to the element that is on top of the page such as header or navigation bar.

I understand, but in the video she does not do that. Why? thanks!

that is a good solution. you can also write like this, <p><a href="#"><img src="http://placeimg.com/400/480/people" alt="Drawing of Jane Smith" class="profile-image">This is a third paragraph</a></p> - which is a built in command navigating you to the top of the page