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.

CSS

Jack Xu
Jack Xu
595 Points

Problems validating CSS code

I can't get my CSS code validated through http://jigsaw.w3.org/css-validator. It comes up with this:

9 GENERAL * Parse Error *********************************** header { font-family: 'Ubuntu', sans-serif; }

When I try to remove that element it creates an error for the following element and so on... Can anyone shed some light on this problem?? :)

3 Answers

Ryan Field
PLUS
Ryan Field
Courses Plus Student 21,241 Points

Okay, so I edited a bit to make it easier to read, and it looks like the problem is in the first line: you've just closed your comment prematurely. The top should look like this:

/************************************
GENERAL
***********************************/
Ryan Field
PLUS
Ryan Field
Courses Plus Student 21,241 Points

Hi, Jack. Can you paste your CSS here so we can take a look at it and better troubleshoot it with you?

Jack Xu
Jack Xu
595 Points

CSS

/************************************/
GENERAL
***********************************

header {
  font-family: 'Ubuntu', sans-serif;
}

a {
  text-decoration: none;
}

#wrapper {
  max-width: 940px;
  margin: 0px auto;
  padding: 0 5%;
  background: #ECEDEB;
}

img {
  max-width: 100%;
  margin: 0px 0;
}

/***********************************
PAGE: about
************************************/

.profile-photo {
  margin: 5% 0;
  align-content: center;
  width: 40%;
  height: 40%;
}


/***********************************
PAGE: Contact
************************************/

.contact-info {
  list-style: none;
  font-size: 0.9em;
}

.contact-info a {
  display: block;
  min-height: 20px;
  background-repeat:no-repeat;
  background-size: 20px 20px;
  padding: 0 0 0 30px;
  margin: 0 0 10px;
}

.contact-info li.phone a {
  background-image: url('../Images/phone.png');
}

.contact-info li.mail a {
  background-image: url('../Images/mail.png');
}

/***********************************
HEADING
************************************/
/*

#header {
  float: left;
  max-width: 100%:
}
*/

#logo {
  text-align:center;
  margin:0;
}

h1 {
  font-family: 'Ubuntu', sans-serif;
  margin: 0px 1%;
  font-size: 3em;
  font-weight:normal;
  line-height: 2em;
}

h2 {
   font-family: 'Ubuntu', sans-serif;
  margin: -15px 0 0;
  font-size: 1.5em;
  font-weight: normal;
  line-height: 1em;
}

h3 {
  font-family: 'Ubuntu', sans-serif;
  margin-top: 5%;
  padding: 10px;
  font-weight: bold;
  font-size: 2em;
  text-align: center;
  color: orange;
}

/***********************************
Navigation
************************************/

nav {
  font-size: 1.1em;
  text-align:center;
  padding: 10px 0;
}

nav ul {
  list-style: none;
  margin: 0;
  padding: 4% 2% 0 5%;
}

nav li {
  display: inline-block;
}

nav a {
  padding: 10px 15px;
  font-weight: 800;
}


/***********************************
Footer
************************************/

footer {
  font-size: 0.8em;
  text-align:center;
  padding: 10px 0;
  margin: 20% 0 0 0;
  clear:both;
}

.social-icon {
  width: 25px;
  height: 25px;
  margin: 0 5px;
}



/***********************************
Portfolio
************************************/

#gallery {
  padding: 0;
  margin: 0;
  list-style: none;
}

#gallery li{
  float: left;
  width: 45%;
  margin: 2.5%;
  background-color: #f5f5f5;
  color: #f5f5f5;
}

#gallery li a p {
  Margin: 0px 0;
  padding: 2%;
  font-size: 0.95em;
  color: #000;
  background-color: #ECEDEB;
}


/***********************************
Colors
************************************/

body {
  color: #000;
  background: #ECEDEB;
}

header {
  background: #A0A39D;
  border-color: #EFFFE7;
}

h1, h2 {
  color: #fff;
}

nav a, nav a {
  color: #fff;
}

nav a.selected, nav a:hover {
  color: #328847;
}

p {
  color: #000;
}
Jack Xu
Jack Xu
595 Points

Oh yeah.. Rookie mistake! Thanks a lot Ryan!

Ryan Field
Ryan Field
Courses Plus Student 21,241 Points

Not rookie at all! These kinds of things sneak by all the time, so don't worry too much about it. :)

Jack Xu
Jack Xu
595 Points

okay it does of course look a bit different in workspaces..

HI Ryan,

You can click on the '...' below your comment and change your comment to an answer.

Ryan Field
Ryan Field
Courses Plus Student 21,241 Points

Hey Jason. Yeah, I know, I just usually make a new comment (if a new comment has been started instead of a reply) so that my answer goes to the proper question and to ensure the other party gets a notification of a reply. :)

Edit: Oh, nvm, I see what you're saying now! Thanks for the head's up!

Hi Jack,

You have the option of selecting "Best Answer" if an answer solves your problem. This will let others know that the question has been solved.