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

CSS CSS Basics (2014) Enhancing the Design With CSS Text Shadows and Box Shadows

Talha Khalid
Talha Khalid
10,262 Points
Posted by Talha Khalid
Talha Khalid
10,262 Points

Error on task 4

I am having issues with this task not passing. I am seperating the values with a comma yet I am still not getting the correct answer. Can anyone see where the issue is? Thanks in advance!

style.css 
/* Complete the challenge by writing CSS below */

.main-heading{
text-shadow: 0px 0px 5px #be7b31;}

.title{
text-shadow: 1px 3px 0px #e59740;}

.main-header{
box-shadow: 0px 2px 15px #aaa, inset 0px 0px 60px 5px firebrick;}
index.html 
<!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 &raquo;</a>
        </footer>
  </body>
</html>

3 Answers

Chyno Deluxe
Chyno Deluxe
16,936 Points

Your answer is correct but you don't need to add px to zero(0) values. Just remove those and it should pass.

.main-header {
box-shadow: 0 2px 15px #aaa, inset 0 0 60px 5px firebrick;
}
Jason Anders
MOD
Jason Anders
Treehouse Moderator 145,860 Points
Jason Anders
Jason Anders
Treehouse Moderator 145,860 Points

Hi Talha,

Your problem is adding the px to the zero values. I have no explanation as to why the other tasks allowed you to pass with 0px as a value (a glitch in the code checker probably), but if you delete the 3 px on the zero values in your box-shadow, the 4th task will pass.

Anytime you are including a zero value in a declaration, you should not use any 'fixed measurements'.

Keep Coding! :)

Talha Khalid
Talha Khalid
10,262 Points
Talha Khalid
Talha Khalid
10,262 Points

It works! Thanks guys!