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.
Thomas Guppy
3,307 PointsMedia Queries. Problem on first challenge
I'm certain I have this right, but its not being accepted:
task 2: Next, create a new media query that sets the body element's background color to #4682B4 if the viewport width is 480px or less.
I have entered the color exactly as written above:
@media screen and (max-width: 480px) {
body { background: #4682B4; }
}
but i keep getting this message: Bummer! Did you specify the right background color?
Have i done something wrong or is the task faulty?
sorry for the double post
5 Answers
Thomas Guppy
3,307 Pointsquestion 1 required i enter 'white' for the color value... Even though I entered a hexidecimal the other day, which worked fine. question 2 passed with the exact same code I used in the first place... I don't know what changed.
Thanks for the help.
David Tonge
Courses Plus Student 45,640 PointsHey Thomas,
I hope all is well. Your code is correct but you're using the shorthand "background" property, which can be used to specify various things with the use of different values. This challenge is looking for the "background-color" property. I tested it out to confirm.
@media screen and (max-width: 480px){
body{
background-color: #4682B4;
}
}
Jason Anello
Courses Plus Student 94,597 PointsHi David,
It passes fine with background.
Try going through the challenge again but remove one of the closing curly braces from the first media query. You end up getting the same error message reported in the question.
Jason Anello
Courses Plus Student 94,597 PointsCheck that you have both of your closing curly braces in your first media query.
Thomas Guppy
3,307 PointsI double checked the curly braces in the first media query. Still no good.
Also, I've retried the question and the same problem is now occurring on question one. This is what i entered: @media screen and (max-width: 768px) { body { background: #FF6347; color: #FFF; } }
David Tonge
Courses Plus Student 45,640 PointsTry using "background-color" instead then tell me if it still reports an error for you
@media screen and (max-width: 768px) {
body {
background-color: #FF6347;
color: #FFF;
}
}
Thomas Guppy
3,307 PointsSorry, I should have mentioned i tried that in the first place but it didn't work. However, i just passed it using the same answer i already tried previously. I don't know what changed
Jason Anello
Courses Plus Student 94,597 PointsJason Anello
Courses Plus Student 94,597 PointsGlad you got it worked out. Maybe there was some slight difference from the first time or a temporary problem with the code checker.