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
Lena Apoyan
11,728 PointsShadows
I cannot go through this task. The task is "Let's give .main-header an inner-shadow with a second set of box-shadow values. Set the new shadow's horizontal and vertical offsets to 0, the blur radius to 60px, the spread radius to 5px, and the color to firebrick. Don't forget to include the keyword value that creates an inner box shadow." When I click the button to check it gives me an error "The second box shadow needs the value that creates an inner shadow." But I have already put inset in code, please help me to find a mistake.
/* Complete the challenge by writing CSS below */
.main-heading {
text-shadow: 0 0 5px #be7b31;
}
.title {
text-shadow: 1px 3px 0 #e59740;
}
.main-header {
box-shadow: 0 2px 15px #aaa,
box-shadow: inset 0 0 60px 5px firebrick;
}
6 Answers
Travis Wagner
17,134 PointsTry putting it all on one line, with a comma separating.
box-shadow: 0 2px 15px #aaa, inset 0 0 50px 5px firebrick
When I tried putting it on two separate lines, it would not pass, when I deleted the page break, it worked.
Diego Lucero
10,588 PointsThat was it! Thank you Travis!
Lena Apoyan
11,728 PointsThank you Travis! :)
Aldrin Mabanta
11,768 PointsHi Lena,
I just did the challenge and I noted the code below ... worked well. Hope this helps you.
/* Complete the challenge by writing CSS below */
.main-heading { text-shadow: 0 0 5px #be7b31; }
.title { text-shadow: 1px 3px 0 #e59740; }
.main-header { box-shadow: 0 2px 15px #aaa, inset 0 0 60px 5px firebrick; }
channonhall
12,247 PointsThank you!!! Aldrin it worked for me!!! ^^D
arnavthecoder
3,453 Pointstry going through it again and again and see if you made a mistake. Even the littlest mistake can make your answer wrong.
Lena Apoyan
11,728 PointsThank you for advice! I've tried to go through again but it didn't help to find out what was wrong.
MUZ140845 Motion Kativhu
9,585 Pointshi! can some1 help. i've tryed this but failed to procced to the next ? where am i typing it wrong?
/* Complete the challenge by writing CSS below */
.main-heading {
text-shadow: 0 0 5px #be7b31;
}
.title {
text-shadow: 1px 3px 0 #e59740;
}
.main-header {
box-shadow: 0 2px 15px #aaa;
}
channonhall
12,247 PointsTry this!
- Complete the challenge by writing CSS below */
.main-heading { text-shadow: 0 0 5px #be7b31; }
.title { text-shadow: 1px 3px 0 #e59740; }
.main-header { box-shadow: 0 2px 15px #aaa, inset 0 0 60px 5px firebrick; }
hope this helps :)
MUZ140845 Motion Kativhu
9,585 Pointsi just add '}' and got it write
arnavthecoder
3,453 Pointsoh... try reloading the page because there seems to be no problem.
Lena Apoyan
11,728 PointsI started the challenge again but it is the same, don't know what to do.
Diego Lucero
10,588 PointsDiego Lucero
10,588 PointsLena Apoyan , it looks like you started a second box-shadow rule, and you ended the first in a comma.
The first issue is that the second
box-shadow:rule will override the first rule. In this case you will need to use a comma to separate multiple box-shadow values in the same rule, without writing a secondbox-shadow:rule.The second issue is that the proper way to end a css rule is with a
;, which tells the browser the the rule has ended and that it is ok to run it in the browser. Without that rule-ending semi-colon, the browser will continue to read every other character until it reaches that semicolon (;) character. In your first instance of thebox-shadow:rule, you ended it in a comma, which confused the browser when you added the secondbox-shadow:rule.Back to the solution to this problem:
Normally in a CSS stylesheet, the line break (your enter after the first instance of
box-shadow) that you have there will not be an issue. It seems that it is only an issue with the treehouse testing platform (it looks like it's a bug). But to pass the quiz question and to move on in Treehouse, you would need to remove the line break and place the rules onto the same line.The code that will pass this quiz is as follows:
IMPORTANT
It's important to note that at any other time when you are designing websites, you CAN have the line break after the comma. It's just in Treehouse that it gives us an error. So feel free to use the line break to help you to organize your code in the future for easier readability.