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 HTML Basics Going Further with HTML Linking to Sections of a Web Page

Dayna Wiggins
Dayna Wiggins
666 Points

Problem with id="articles"

Sorry for the long paste but im stuck on <li><a href="#articles">Articles</a></li>

The about and contact links work and take you to the specific place on the page but the articles one wont. I have looked and triple checked but i cant see why it wouldnt work like the rest. Any ideas?

Thanks

<!DOCTYPE html> <html>

<head> <title>Experience VR</title> </head>

<body>

<div> <header> <h1>Experience VR</h1> <p>A simple blog about virtual reality experiences</p>

  <nav>
    <ul>
      <li><a href="#">Home</a></li>
      <li><a href="#about">About</a></li>
      <li><a href="#articles">Articles</a></li>
      <li><a href="#contact">Contact</a></li>
    </ul>
  </nav>
</header>

<div>
  <img src="me.png" alt="picture of D Wiggins">
  <p>Virtual Reality is becoming well known as a form of entertainment, but it's also finding its way into fields like education, industrial design, healthcare and so much more</p>
  <a href="https://teamtreehouse.com/vr" target="_blank"> Start your VR journey!</a>
</div>

<main>
  <section id="about">
    <h2>About thise site</h2>
    <p><span>Lorem ipsum dolor sit amet</span>, consectetur adipiscing elit. Vivamus ultrices euismod turpis eget porta. Etiam nulla massa, pretium et massa nec, ornare dignissim nisi.</p>
    <img src="tulips.jpg" alt="picture of tulips">
  </section>

  <section id="articles">
    <h2>Latest VR articles</h2>
    <article>
      <header>
        <h3>How Schools use virtual reality to improve education</h3>
        <p>By: Authoer D wiggins</p>
      </header>
      <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus ultrices euismod turpis eget porta. Etiam nulla massa, pretium et massa nec, ornare dignissim nisi.</p>
      <a href="article.html#vr-article">Read more</a>
      <footer>Pulished: September 10, 2017</footer>
    </article>

    <article>
      <header>
        <h3>The Advantages of VR simulation</h3>
        <p>By: Authoer D wiggins</p>
      </header>

      <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus ultrices euismod turpis eget porta. Etiam nulla massa, pretium et massa nec, ornare dignissim nisi.</p>
      <a href="#">Read more</a>
      <footer>Pulished: September 12, 2017</footer>
    </article>
  </section>

  <section id="contact">
    <h2>Contact</h2>
    <p><strong>Email us at: </strong><a href="https://www.gmail.com" target="_blank">coolvrexperience@gmail.com</a></p>
    <p>
      <Strong>Phone: </strong>07850349968</p>
    <p>
      <Strong>Address:</strong>
    </p>
    <address>
      VR Experience Unit 1<br>
      Greensway<br>
      NC
    </address>
  </section>
</main>

<aside>
  <h3>Top VR Resources</h3>
  <ol>
    <li><a href="https://unimersiv.com/" target="_blank">Learn to create educational experiences in VR</a></li>
    <li><a href="https://filmora.wondershare.com/virtual-reality/virtual-reality-use-in-entertainment.html" target="_blank">Virtual Reality in Entertainment</a></li>
    <li><a href="https://www.viatechnik.com/resources/50-virtual-reality-technologies-in-architecture-engineering-and-construction/" target="_blank">Interact with buildings and products in VR</a></li>
    <li><a href="https://www.pgi.com/resources/articles/3-ways-vr-technology-will-create-better-meetings/" target="_blank">Use VR for teleconferencing and social media</a></li>
  </ol>

  <hr>

  <blockquote>
    "Virtual reality was once the dream of science fiction. But the internet was also once a dream, and so were computers and smartphones. The future is coming." -
    <footer>
      <cite><a href="https://www.facebook.com/zuck/posts/10101319050523971" target="_blank">Mark Zuckerberg</a></cite>
    </footer>
  </blockquote>
</aside>

<footer>
  <p><small>&copy;2017 Experience VR, The Blog</small></p>
</footer>

</div> </body>

</html>

5 Answers

Agnes Demes
Agnes Demes
6,613 Points

Hi again, so i just pasted your code into visual studio and all fragment links were working perfect including the article. However visual studio pointed out 2 tiny typos: The start <strong> tag is typed with a Capital letter in these 2 cases. <Strong>Phone: </strong>07850349968</p> <Strong>Address:</strong> Otherwise the whole code is well indented and well written. I hope this helps.

Agnes Demes
Agnes Demes
6,613 Points

Everything seems perfect..could this be that the browser haven't caught up to the changes ? Restart preview and see if it works.

Dayna Wiggins
Dayna Wiggins
666 Points

Hi, thanks for your response.

Well i guess as long as i had it right haha. I did restart the preview many times and even tried a web server but always the same problem.

This was on Atom by the way so maybe its something with the program

very peculiar though ha

Agnes Demes
Agnes Demes
6,613 Points

Hi, There This thing is bugging me, haha no-pun intended. I will try as well and paste it in atom. Can you please load the css file you have so I can replicate everything the same. I hope we can find the answer. :)

Dayna Wiggins
Dayna Wiggins
666 Points

Hey thanks for the help. When i loaded up this morning it was working haha!

I guess it was an atom problem which fixed when i restarted the laptop. Ive also corrected the typos Thanks