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 Alexandra Symeonides-Tsatsos
Alexandra Symeonides-Tsatsos
1,296 Points

Why does workspace and validator mark stuff as wrong when its not?

I've finished building the profile project and the preview works and everything. However, when I run the code through code validator it says there are tons of errors. All of the errors say that there are tags that aren't closed but from what I can see they are closed. Workspaces also flags the same errors that I don't think are there

Here is the link to my workspaces! https://w.trhou.se/16inf9hn28

Any ideas as to what is going on? Thank you so much! <3

1 Answer

Ryan Field
Ryan Field
Courses Plus Student 21,242 Points

Hi, Alexandra. I ran your code through the W3C validator, and have some answers for you! :) The first error is about the pipe character (|) in your Google Fonts link. While the code is fine, W3C prefers these kinds of characters to be coded as NFC (the funny characters you sometimes see in web links). Changing it to %7C will fix that problem. The rest about open tags is because in your ul (unordered list), you're closing the li tags before the a tags.

You have this:

        <ul>
          <li><a href="index.html" >Portfolio</li> </a>
          <li><a href="about.html" class="selected">About</li> </a>
          <li><a href="contact.html">Contact</li> </a>
        </ul>

but it should be this:

        <ul>
          <li><a href="index.html" >Portfolio</a></li>
          <li><a href="about.html" class="selected">About</a></li>
          <li><a href="contact.html">Contact</a></li>
        </ul>

When you nest tags, always close them in the opposite order you opened them.

Those two fixes should solve all the validation errors. :)

Chris Shaw
Chris Shaw
26,676 Points

Hi Alexandra and Ryan,

To extend off Ryan' answer, there is also a couple more issues which are harder to use but are there. They are:

  1. you're missing a closing tag at the end of your second UL

  2. you have a closing DIV after the the closing footer tag which doesn't belong because you don't have an open DIV anywhere.

See the below image in regard to these two points.

Markup tags are invalid

Just as an FYI, anytime Workspaces marks something as red it generally means the code is formatted correctly but sometimes you can get it in error which isn't the case here when using 3rd party code. Along with that the W3C validator is extremely good at picking up these problems so I recommend taking a few minutes to read through each error, picking out that piece of code it's warned you about and checking it over as it's generally the smallest oversights are the ones that can cause the biggest issues.

Alexandra Symeonides-Tsatsos
Alexandra Symeonides-Tsatsos
1,296 Points

Thank you so much! This helped a lot!