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 trialKyle Cameron
20,683 PointsIssue with code challenge
@mixin square($size, $color: 1px solid) { height: $size; width: $size; border: $color; }
This challenge keeps asking me to set the value of $color to 1px solid. I cant figure out why this isn't correct?
@mixin square($size, $color:1px solid) {
height: $size;
width: $size;
border: $color;
}
1 Answer
Ray Karyshyn
13,443 PointsThe challenge is not asking you to set $color equal to "1px solid."
Instead, it is asking you to set the color of a border that has a width 1px and is solid.
@mixin square($size, $color) {
height: $size;
width: $size;
border: 1px solid $color;
}
Alex Moser
6,301 PointsAlex Moser
6,301 PointsHi Kyle,
I believe the wording in the quiz is a bit confusing but you are on the right track!
When creating a mixin, the variables usually are only meant for a single property. In your code,
$color: 1px solid
is telling Sass to compile anywhere the$color
variable is listed as1px solid
-- unless you give it a different color when using the mixin in the wild.1px solid
is not a color is it? :)The correct way to define the square mixin is as follows:
Using this mixin, you'd get a 20px pink box because you already set a default color in the original mixin declaration:
Now, if you then wanted to change the color of this box:
which would give you a 20px black box.