SASS - Create Reusable CSS with Mixins

Tell us what’s happening:

I feel like the code is correct but for some reason is not working. Is there something that I am doing wrong?

Your code so far

<style type='text/scss'>
@mixin shape($w, $h, $bg-color){
  width: $w;
  height: $h;
  background-color: $bg-color;
}

#square {

@include shape(50px,50px,red)

}

#rect-a {
  @include shape(100px,50px,blue)
}

#rect-b {
  @include shape(50px,100px,orange)
}
</style>

<div id="square"></div>
<div id="rect-a"></div>
<div id="rect-b"></div>

Your browser information:

User Agent is: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/133.0.0.0 Safari/537.36

Challenge Information:

SASS - Create Reusable CSS with Mixins

I was able to figure it out! I forgot to add " ; " at the end.

This took me like 30 minutes to figure out…

1 Like

Grit and persistence like this will take you a long way.

1 Like