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 trialManish Giri
16,266 PointsBug: Placing 'inset' at the starting doesn't pass the challenge
In the video, it is said that the inner shadow can be placed either at the beginning or at the end, it just needs the , either way for the right syntax.
However, in this challenge, I can't pass the task if I place inset and the second shadow at the beginning, it only works if inset is placed at the end.
My code is attached. If you see the CSS - placing inset at the front doesn't work.
Is this a bug?
/* 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: inset 0 0 60px 5px firebrick,
0 2px 15px #aaa;
}
<!DOCTYPE html>
<html>
<head>
<title>Lake Tahoe</title>
<link rel="stylesheet" href="page.css">
<link rel="stylesheet" href="style.css">
</head>
<body>
<header id="top" class="main-header">
<span class="title">Journey Through the Sierra Nevada Mountains</span>
<h1 class="main-heading">Lake Tahoe, California</h1>
</header>
<div class="primary-content">
<p class="intro">
Lake Tahoe is one of the most breathtaking attractions located in California. It's home to a number of ski resorts, summer outdoor recreation, and tourist attractions. Snow and skiing are a significant part of the area's reputation.
</p>
<a class="callout" href="#more">Find out more</a>
</div><!-- End .primary-content -->
<footer class="main-footer">
<p>All rights reserved to the state of <a href="#">California</a>.</p>
<a href="#top">Back to top »</a>
</footer>
</body>
</html>
2 Answers
Murdo MacNab
9,245 PointsI don'nt think it's a bug, just that it's not the correct answer to the question. Worth copying the code into a text editor and testing it to see if it works either way.
Feisty Mullah
25,849 PointsHi Manish, You need to change the position of your codes. I have tried like this and it passed.
.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;
}
Doegena Fennich
8,974 PointsDoegena Fennich
8,974 Pointsplace the box shadow of task 3 above the box shadow inset of task 4.
example: