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
barnabasadedoyin
1,501 PointsCSS wasn't validated
I got this also from css validator level 3
36 header Value Error : padding-top Too many values or values are not recognized : 5px 0 47 h1 Parse Error 0; 52 Parse Error [: 1.75em; font-weight: normal; line-height: 0.8em; } h2]
How can I solve this?
barnabasadedoyin
1,501 PointsOk Jason, but more than 60 lines. main.css:
/*************************************
GENERAL
*************************************/
body {
font-family: 'Open Sans' , sans-serif;
}
#wrapper{
max-width: 940px;
margin: 0 auto;
padding: 0 5%;
}
a {
text-decoration: none;
}
img {
max-width: 100%;
}
h3 {
margin: 0 0 1em 0;
}
/*************************************
HEADING
*************************************/
header {
float: left;
margin: 0 30px 0 0;
padding-top: 5px 0;
width: 100%;
}
#logo {
text-align: center;
margin: 0;
}
h1 {
font-family: 'Changa One' , sans-serif;
margin: 15px; 0;
font-size: 1.75em;
font-weight: normal;
line-height: 0.8em;
}
h2 {
font-size: 1.75em;
margin: -5px 0 0;
font-weight: normal;
}
/*************************************
NAVIGATION
*************************************/
nav {
text-align: center;
padding: 10px 0;
margin: 20px 0;
}
nav ul {
list-style: none;
margin: 0 10px;
padding: 0px;
}
nav li {
display: inline-block;
}
nav a {
font-weight: 800;
padding: 15px 10px;
}
/*************************************
PAGE: FOOTER
*************************************/
footer {
font-size: 0.7em;
text-align: center;
clear: both;
padding-top: 50px;
color: #ccc;
}
.social-icon {
width: 20px;
height: 20px;
margin: 0 5px;
}
/*************************************
PAGE: PORTFOLIO
*************************************/
#gallery {
margin: 0;
padding: 0;
list-style: none;
}
#gallery li {
float: left;
width: 45%;
margin: 2.5%;
background-color: #f5f5f5;
color: #bdc3c7;
}
#gallery li a p {
margin: 0;
padding: 5%;
font-size: 0.75em;
color: #bdc3c7;
}
/*************************************
PAGE: ABOUT
*************************************/
.profile-photo {
display: block;
max-width: 150px;
margin: 0 auto 30px;
border-radius: 100px;
/* Prevent background color leak outs */
-webkit-background-clip: padding-box;
-moz-background-clip: padding;
background-clip: padding-box;
}
/*************************************
PAGE: CONTACT
*************************************/
.contact-info {
list-style: none;
padding: 0;
margin: 0;
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('../img/phone.png');
}
.contact-info li.mail a {
background-image: url('../img/mail.png');
}
.contact-info li.twitter a {
background-image: url('../img/twitter.png');
}
/*************************************
COLORS
*************************************/
/* site body */
body {
background: #fff;
color: #999;
}
/* green header bg */
header {
background-color: #6ab47b;
border-color: #599a68;
}
/* nav background on mobile */
nav {
background: #599a68;
}
/* logo text */
h1, h2 {
color: #fff;
}
/* link color */
a {
color: #7e7e7e;
}
/* nav link color */
nav a, nav a:visited {
color: #fff;
}
/* nav link selected */
nav a.selected, nav a:hover {
color: #32673f;
}
3 Answers
barnabasadedoyin
1,501 PointsBeautiful! Nicely put.
Jason Anello
Courses Plus Student 94,610 PointsThanks for posting the css. Sorry for the confusion but I meant to post only line numbers 30 to 60 because all of your errors were in that range but it's ok to post all of it.
The first error was reported for line 36:
padding-top: 5px 0;
The validator is reporting too many values because you have 2 values there and you can only have 1 when using padding-top
You can change it to padding-top: 5px; or use the shorthand property as shown in the course padding: 5px 0 0 0;
The next error was on line 47:
margin: 15px; 0;
You have an extra semi-colon there after 15px
Your 3rd error went away after fixing those 2 errors. I think it was a false error triggered by the 2nd error.
Because of that I would recommend that you fix the errors reported in order and maybe re-validate every 1 or 2 errors that you fix because some may go away.
barnabasadedoyin
1,501 PointsValidated! Thank you Jason. How can someon know about those errors next time?
Jason Anello
Courses Plus Student 94,610 PointsWell, the validator will try to help you by telling you the line number the problem was on.
In your case, the 1st error was reported on line 36. So you would look at the error message for a hint as to what might be wrong, "header Value Error : padding-top Too many values or values are not recognized", then you would go back to your text editor and see what you have on line 36.
Then it's a matter of looking it over and trying to figure out what you might have done wrong. I think as you gain more experience you'll getter better at this process.
Also, as you gain more experience you'll be making less of these types of errors.
Joshua Nevard
1,771 PointsHey people!
I am trying to validate my CSS and I am getting an error saying
"URI : TextArea 198 Parse Error [: visted]"
my code for this location is:
/nav link/ nav a, nav a: visted { color: #fff; }
Would someone please help me.
Many thanks, Josh
Joshua Nevard
1,771 PointsSorry people I worked it out... DUH, I spelt "visited" wrong!
Jason Anello
Courses Plus Student 94,610 PointsJason Anello
Courses Plus Student 94,610 PointsHi barnabasadedoyin,
Can you post all of your css from the "HEADING" section of your main.css file? This should be approximately lines 30 to 60 and should cover all those errors.