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 to Sass Refactoring with Sass Defining Media Queries

Posted by Stu Cowley
Stu Cowley
26,287 Points

Huh? Arrow Won't Hide at 768px Breakpoint

Hey everyone,

I've been following along with this video exactly with Guil Hernandez, and we're up to the part where we hide the arrow on the Lake Tahoe project and I have run into a problem where the arrow won't actually hide at the 768px viewport. I'm totally stuck, I've rewritten the code to match that of Guil, but still I face the same issue.

Here is my code:

_variables.scss

$break-narrow   : '(max-width: 768px)';
$break-wide     : '(max-width: 1024px)';

_icons.scss

.arrow {
   width: 50px;
   margin-top: 150px;

   @media #{$break-narrow} {
      display: none;
   }
}

No doubt I've missed something as I have been sitting here for the past 3 hours without any form of a caffeinated beverage.

Any help on this would be greatly appreciated!

Thanks in advance

Stu :)

2 Answers

Keegan Usher
Keegan Usher
26,226 Points
Keegan Usher
Keegan Usher
26,226 Points

I had the same issue. I had my Sass --watch set for the wrong file directory so my css file was not being updated. Once I changed and fixed a few errors everything started working correctly.

Craig Watson
Craig Watson
27,930 Points
Craig Watson
Craig Watson
27,930 Points

Hi Stu,

Have you managed to get to the bottom of this?

I ran the code through sass meister and it spat out what you would expect so no error in the above code.

Can you do a snapshot of your workspace if you are still having trouble :)

Craig