CSS Sass Basics Add Reusable Logic to Your Sass Advanced Mixins Challenge

Ja'Quan Thompson
seal-mask
.a{fill-rule:evenodd;}techdegree
Ja'Quan Thompson
Front End Web Development Techdegree Student 8,488 Points

How do I include the border mixin in the include rule?

I dont know how to include the border mixin into the include rule. I cant figure out what works for this. please help!

style.scss
@mixin square ($size, $color: black){
height: $size;
width: $size;
color: red;
border: 1px solid $color;


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


    }
  }
}

3 Answers

Bert Witzel
seal-mask
.a{fill-rule:evenodd;}techdegree
Bert Witzel
Front End Web Development Techdegree Student 8,759 Points

Hi Ja'Quan, here is my final solution to the challenge:

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

The $size and $color are placeholders, so for the @include in .box you have to declare the values. Then they ask you to switch them around so you have to write as I did above, otheriwse you could just write @include square(50px, red). Hope that helps, let me know if I can explain further.

Ja'Quan Thompson
seal-mask
.a{fill-rule:evenodd;}techdegree
Ja'Quan Thompson
Front End Web Development Techdegree Student 8,488 Points

Thank you! I had to screenshot that to reference back to it because I just couldn’t understand it the way the course was explaining it