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

anguswhiston
anguswhiston
17,225 Points
Posted by anguswhiston
anguswhiston
17,225 Points

Task 3/6 Advanced Sass concepts

The challenge is "Define a "box" class. Use the "square" mixin to give it a height and width of 10px, and set the border to red."

My code is:

@mixin square ($size, $color: black) {
        width: $size;
    height: $size:
    border: 1px solid $color
    }

.box {
    @include square (10px, red);
}

I am seriously struggling to spot anything wrong with this. Usually it's something so glaringly stupid, but I think I've checked that.

Tagging my new favourite teacher Hampton Catlin for help!

1 Answer

anguswhiston
anguswhiston
17,225 Points
anguswhiston
anguswhiston
17,225 Points

Right if anyone else is struggling with this I've solved it. I won't give the answer exactly, but in code above I was separating the box class entirely from the mixin.

In reality you want to include the .box class within the mixin and then declare a change to it when you run your @include line.

There should be no { } style braces after you've written your mixin.

Hopefully that helps anyone else struggling with this.