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 Compass Basics Getting Started with Compass Getting Started with Compass

ANTONIO ALTAMIRANO
ANTONIO ALTAMIRANO
9,428 Points
Posted by ANTONIO ALTAMIRANO
ANTONIO ALTAMIRANO
9,428 Points

Stuck on Code Challenge. Don't know what i am doing wrong. Next, use a mixin to give the transform property in .main-log

Next, use a mixin to give the transform property in .main-logo a CSS transition. Set the transition duration to .6s. error: Compilation Error! my code:

sass/style.scss 
/* Write your SCSS code below. */

// Imports


// Variables


// Page Styles

body {
@import "compass/css3";
@include background(linear-gradient(#3d69b5, #1a335e));
$experimental-support-for-svg: true;
}

.main-logo{
    @include single-transition(transform, 0.6s);
}
index.html 
<!DOCTYPE html>
<html>
<head>
  <title>My Compass Project</title>
  <link href="stylesheets/style.css" rel="stylesheet">
</head>
<body>
  <div class="main-logo"></div>
</body>
</html>

1 Answer

elk6
elk6
22,916 Points

Hi Antonio,

You should take the @import rule out of the body and place it under the //import.

Like this:

sass/style.scss 
/* Write your SCSS code below. */

// Imports
@import "compass/css3";

// Variables


// Page Styles

body {
@include background(linear-gradient(#3d69b5, #1a335e));
$experimental-support-for-svg: true;
}

.main-logo{
    @include single-transition(transform, 0.6s);
}
ANTONIO ALTAMIRANO
ANTONIO ALTAMIRANO
9,428 Points
ANTONIO ALTAMIRANO
ANTONIO ALTAMIRANO
9,428 Points

Thank you. That's where my error was.

Cena Mayo
Cena Mayo
55,236 Points

Just to clarify for future reference: putting the @import in the body tag scopes it to the body, and doesn't allow you to use it globally.

ANTONIO ALTAMIRANO
ANTONIO ALTAMIRANO
9,428 Points
ANTONIO ALTAMIRANO
ANTONIO ALTAMIRANO
9,428 Points

Thank you Cena Mayo for adding the clarification. You guys are awesome for helping me out. I was going to call it quits for the day and try it again tomorrow. Now I think I will press on for another hour.