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 Sass Basics (retired) Advanced Sass Concepts Advanced Mixin Arguments

Posted by Michael Whalen
Michael Whalen
6,908 Points

Advanced Sass Concepts Challenge 1/6 (No idea what I'm doing wrong.)

For the life of me, I don't know why this keeps giving me a compilation error. I've even copied it from answers from the forums.

Create a mixin called square that takes two arguments - one called "size" that will set the height and the width, and one called "color" that will set the color of a 1px solid border.

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

EDIT: Sorry, it seems to be working now. Specifying the $color argument as $color: black made it work.

3 Answers

Micah Grotte
PLUS
Micah Grotte
Courses Plus Student 8,645 Points
Micah Grotte
Micah Grotte
Courses Plus Student 8,645 Points

Hmmm, yea thats very strange. Being a student, I would have a hard time diagnosing a bug in Tree House's code, but it does seem like the order of those two elements shouldn't impact the result they are looking for. That code challenge was difficult for me, let me know if you have any further problems, and I'll do my best to help.

Micah Grotte
PLUS
Micah Grotte
Courses Plus Student 8,645 Points
Micah Grotte
Micah Grotte
Courses Plus Student 8,645 Points

Try this maybe

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

.box { @include square($size, $color); }

Michael Whalen
Michael Whalen
6,908 Points
Michael Whalen
Michael Whalen
6,908 Points

Micah, I put in your code like this, without the box class :

@mixin square ($size, $color) { 

width: $size; 
height: $size; 
border: 1px solid $color; }

And it worked. The only difference between my code and yours is the order in which width and height are defined. Maybe I had a bug or something. :/