Welcome to the Treehouse Community

The Treehouse Community is a meeting place for developers, designers, and programmers of all backgrounds and skill levels to get support. Collaborate here on code errors or bugs that you need feedback on, or asking for an extra set of eyes on your latest project. Join thousands of Treehouse students and alumni in the community today. (Note: Only Treehouse students can comment or ask questions, but non-students are welcome to browse our conversations.)

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and a supportive community. Start your free trial today.

General Discussion

So what's up with code being highlighted like it has errors when it doesn't, even in the tutorial vids? Confusing.

There's plenty of instances where a code is written correctly, and in the workspace (as well as in the tutorial videos) parts will be highlighted like it's pointing out errors or reminding you of a missing piece. This is really confusing as every time something is highlighted in red or made to look like it needs to be reviewed for correctness, you have to stop and think about it. I'd just as soon have no indication of a line of code being incorrect than giving a bunch of false errors.

No, I'm not just missing something in my code, as I stated it happens in the tutorial videos as well and the author never acknowledges it.

5 Answers

Michael Hulet
Michael Hulet
47,842 Points

Workspaces (along with any other text editor you'll find, other than maybe Notepad) automatically changes what color certain parts of your code is written in to denote that it means something to the code. For example, notice the coloring here:

<!-- This is a comment. Notice how it's colored differently than the text inside the tag -->
<h1 class="purple" id="header">This is text inside of a tag, which is colored differently from the tag itself</h1>

In the case above, Treehouse colors the comment green to show that it's a comment, and won't actually render on the page. It colors the tags green, too, which is coincidental that it's colored the same as the comment. The text inside the tags is colored orange, because it's text that will display. The text ""purple"" and ""header"" is colored purple, because it's the value of an attribute, and means something different to the browser than everything else. Look at this next example:

html{
  background: green;
}

.purple{
  color: orange;
}

#header{
  font-family: monospace;
}

Notice how all the attributes and their values are colored orange. That's simply because they're all attributes and their values. The punctuation is colored white/light gray, because it's necessary punctuation, and the color points that out. The html part is colored green because it's a selector for a tag. Like wise, .purple is orange because it selects a class, and #header is yellow, because it selects an id. Basically, what I'm trying to say is that the text you write is supposed to be colored, and that color has different meanings, and those meanings are not necessarily errors

I understand the text color denoting different classifications and functions, I'm referring to the red highlight that is meant to denote an error, but often crops up when there is nothing incorrect or incomplete.

Michael Afanasiev
PLUS
Michael Afanasiev
Courses Plus Student 15,596 Points

I'm with you Josh, I know exactly what you mean. I've seen most of these "errors" on media queries.

Here's a post by me 3 months ago on the same subject (https://teamtreehouse.com/community/media-wrong) - still no clue why they appear...

That's exactly what I was referring to. Just wanted to point it out if it was something Treehouse needed to correct. Thanks Michael.

Jarett sisk
Jarett sisk
7,522 Points

I just started experiencing this. I thought it was a button i pressed lol