Link to Internal Sections of a Page with Anchor Elements 5

Link to Internal Sections of a Page with Anchor Elements 5
0
#1

Tell us what’s happening:
Totally confused on how to do this lesson. Been looking at different topics and can never find anything I can to improve it.

Your code so far


<h2>CatPhotoApp</h2>
<main>
  
  <a href="http://freecatphotoapp.com" target="_blank">cat photos</a>
  
  <img src="https://bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back.">
  
  <p>Kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff. Purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched. Kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff.</p>
  <p>Purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched. Kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff. Purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched.</p>
  <p>Meowwww loved it, hated it, loved it, hated it yet spill litter box, scratch at owner, destroy all furniture, especially couch or lay on arms while you're using the keyboard. Missing until dinner time toy mouse squeak roll over. With tail in the air lounge in doorway. Man running from cops stops to pet cats, goes to jail.</p>
  <p>Intently stare at the same spot poop in the plant pot but kitten is playing with dead mouse. Get video posted to internet for chasing red dot leave fur on owners clothes meow to be let out and mesmerizing birds leave fur on owners clothes or favor packaging over toy so purr for no reason. Meow to be let out play time intently sniff hand run outside as soon as door open yet destroy couch.</p>
  
</main>
  
<footer>Copyright Cat Photo App</footer>

Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/71.0.3578.98 Safari/537.36.

Link to the challenge:
https://learn.freecodecamp.org/responsive-web-design/basic-html-and-html5/link-to-internal-sections-of-a-page-with-anchor-elements/

0 Likes

#2

Let’s take the example code

<a href="#contacts-header">Contacts</a>
...
<h2 id="contacts-header">Contacts</h2>

In this case we have an h2 element with an id of contacts-header. The anchor a element when clicked will bring you to this section of the page, because it has the id of the h2 element as href value (href="#contacts-header")
You need to create a similar thing, just with the text written in the challenge instructions

0 Likes

#3

I don’t exactly understand. I’ve tried doing what you’ve said to, but couldn’t get it to work. I probably entered it wrong.

0 Likes

#4

You have a lot of changes to do, write here your current code so we can check together

0 Likes

#6

" <h2>CatPhotoApp</h2>

<main>

<a href="#footer">Jump to Bottom</a>

<img src=“https://bit.ly/fcc-relaxing-cat” alt=“A cute orange cat lying on its back.”>

<p>Kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff. Purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched. Kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff.</p>

<p>Purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched. Kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff. Purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched.</p>

<p>Meowwww loved it, hated it, loved it, hated it yet spill litter box, scratch at owner, destroy all furniture, especially couch or lay on arms while you’re using the keyboard. Missing until dinner time toy mouse squeak roll over. With tail in the air lounge in doorway. Man running from cops stops to pet cats, goes to jail.</p>

<p>Intently stare at the same spot poop in the plant pot but kitten is playing with dead mouse. Get video posted to internet for chasing red dot leave fur on owners clothes meow to be let out and mesmerizing birds leave fur on owners clothes or favor packaging over toy so purr for no reason. Meow to be let out play time intently sniff hand run outside as soon as door open yet destroy couch.</p>

</main>

<footer>Copyright Cat Photo App</footer>"

0 Likes

#7

Nowhere in your code you have an element with id="footer"

0 Likes

#8

Where to I put that at? Anywhere between the header and footer?

0 Likes

#9

You put it on the footer element.

0 Likes

#10

I tried doing that, but it still says “The footer tag should have an id attribute set to “footer”.”

0 Likes

#11

Post your footer code, use the code formatting.

Edit: Remember that the id value does not use the hash # only the href does.

0 Likes

#12

I’m sorry, but I still do not understand. I looked at the code formatting link you sent, and it’s still saying the same thing I’m trying to put in. Here’s my code:

" <h2>CatPhotoApp</h2>

<main>

<a href="#footer">Jump to Bottom</a>

<img src=“https://bit.ly/fcc-relaxing-cat” alt=“A cute orange cat lying on its back.”>

<p>Kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff. Purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched. Kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff.</p>

<p>Purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched. Kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff. Purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched.</p>

<p>Meowwww loved it, hated it, loved it, hated it yet spill litter box, scratch at owner, destroy all furniture, especially couch or lay on arms while you’re using the keyboard. Missing until dinner time toy mouse squeak roll over. With tail in the air lounge in doorway. Man running from cops stops to pet cats, goes to jail.</p>

<p>Intently stare at the same spot poop in the plant pot but kitten is playing with dead mouse. Get video posted to internet for chasing red dot leave fur on owners clothes meow to be let out and mesmerizing birds leave fur on owners clothes or favor packaging over toy so purr for no reason. Meow to be let out play time intently sniff hand run outside as soon as door open yet destroy couch.</p>

</main>

<id=footer>Copyright Cat Photo App</footer> "

0 Likes

#13

Almost, now you’re missing the opening footer tag.

<footer> <!-- Opening tag -->
</footer> <!-- Closing tag -->

<footer id="some-id"> <!-- Opening tag with an id -->
</footer> <!-- Closing tag -->

Makes sense?

0 Likes

#14

I’m still confused. Sorry, have a major learning disability that acts up from time to time. Here’s what I have now:

" <h2>CatPhotoApp</h2>

<main>

<a href=“footer”>Jump to Bottom</a>

<img src=“https://bit.ly/fcc-relaxing-cat” alt=“A cute orange cat lying on its back.”>

<p>Kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff. Purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched. Kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff.</p>

<p>Purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched. Kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff. Purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched.</p>

<p>Meowwww loved it, hated it, loved it, hated it yet spill litter box, scratch at owner, destroy all furniture, especially couch or lay on arms while you’re using the keyboard. Missing until dinner time toy mouse squeak roll over. With tail in the air lounge in doorway. Man running from cops stops to pet cats, goes to jail.</p>

<p>Intently stare at the same spot poop in the plant pot but kitten is playing with dead mouse. Get video posted to internet for chasing red dot leave fur on owners clothes meow to be let out and mesmerizing birds leave fur on owners clothes or favor packaging over toy so purr for no reason. Meow to be let out play time intently sniff hand run outside as soon as door open yet destroy couch.</p>

</main>

<footer> <!–CatPhotoApp–> </footer>

<footer id=“footer”> <!–CatPhotoAppfooter–>

</footer> <!–Copyright Cat Photo App–><footer> <!–CatPhotoApp–> </footer>

<footer id=“footer”> <!–CatPhotoAppfooter–>

</footer> <!–Copyright Cat Photo App–>

<footer>Copyright Cat Photo App</footer> "

0 Likes

#15

I guess I confused you by using the comments. Just a quite note this is an html comment.

<!-- I'm a comment -->

Anyway, replace all your footers with just this.

<footer id="footer">Copyright Cat Photo App</footer>
0 Likes

#16

Thank you so much! It took me about 2 hours to figure this one out.

0 Likes

#17

Nice good job!

Also, you have nothing to apologize for, learning something new is hard and coding is absolutely no exception. At first, it will just look very foreign and weird, soon it will look more familiar and then it will look like English or whatever language you are used to reading.

Sometimes you just need to take a break. Don’t stress yourself out too much it never works. Some problems are best solved in the shower, or making food, or taking a walk. It’s funny how the brain works. You come back to something the next day, or after a break, and you have the solution in like 30 sec.

0 Likes

#18

Thank you!

And yes, that is true. I’m still learning Technology in the university I go to online, so I’m all new to this coding and stuff.

0 Likes