Https://www.freecodecamp.org/learn/front-end-libraries/sass/create-reusable-css-with-mixins

[nomo]

Tell us what’s happening:

   **Your code so far**

<style type='text/sass'>
@mixin border-radius($radius) {
 -webkit-bPreformatted textorder-radius:$radius;
 -moz-border-radius: $radius;
 -ms-border-radius: $radius;
 border-radius: $radius;
}
 border-radius  maxin {
@include box-shadow(15px);
}

#awesome {
 @include border-radius;
   width: 150px;
   height: 150px;
   background-color: green;
}
</style>

<div id="awesome"></div>

   **Your browser information:**

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/88.0.4324.190 Safari/537.36.

Challenge: Create Reusable CSS with Mixins

Link to the challenge:
https://www.freecodecamp.org/learn/front-end-libraries/sass/create-reusable-css-with-mixins[quote=“nomo, post:1, topic:448752, full:true”]
Tell us what’s happening:

   **Your code so far**

<style type='text/sass'>
@mixin border-radius($radius) {
 -webkit-bPreformatted textorder-radius:$radius;
 -moz-border-radius: $radius;
 -ms-border-radius: $radius;
 border-radius: $radius;
}
 border-radius  maxin {
@include box-shadow(15px);
}

#awesome {
 @include border-radius;
   width: 150px;
   height: 150px;
   background-color: green;
}
</style>

<div id="awesome"></div>

   **Your browser information:**

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/88.0.4324.190 Safari/537.36.

Challenge: Create Reusable CSS with Mixins

Link to the challenge:

freeCodeCamp.org

[/quote]

please help me on this challenge, it says Your code should call the border-radius mixin using the @include keyword, setting it to 15px .

[mientje]

Hi,
There’s a typo in your function definition, second line.
There’s a second typo, you’re calling ‘maxin’ and not ‘mixin’ and you’re using box-shadow instead of border-radius.
I think, I’m not sure, but I think you’re supposed to call the function inside #awesome { }
You’re adding it but you’re not calling it there.
Greets,
Karin

[jwilkins.oboe]

Hi @nomo !

Welcome to the forum!

I think you are making it more complicated than it needs to be.

You don’t need to add this stuff here

@nomo

 border-radius  maxin {
@include box-shadow(15px);
}

I would just follow the example that FCC gave you for boxshadow.
I would just change this part to webkit border radius. That might have also been a typo when you were entering code into the forum.

@nomo

 -webkit-bPreformatted textorder-radius:$radius;

And then you just need to make that change here

@nomo

 @include border-radius;

You can look at the FCC example for guidance on how to fix that.

div {
  @include box-shadow(0px, 0px, 4px, #fff);
}

Hope that helps!

[nomo]

Thank you so much.
You help is much appreciated, I will keep on trying.

Kindly regards

[nomo]

I have been trying would you mind highlight for me so that I will understand better,
See attached photo below

[lasjorg]

Please post your code and not images when asking for help.

You have box-radius in the mixin, it should be border-radius

With that fix your code should be passing even though you really only should have one #awesome selector. Just add the @includes to the selector that was already there in the starter code and remove the extra one you added.

[jwilkins.oboe]

Instructions on how to post code into the forum.

When you enter a code block into a forum post, please precede it with a separate line of three backticks and follow it with a separate line of three backticks to make it easier to read.

You can also use the “preformatted text” tool in the editor (</>) to add backticks around text.

See this post to find the backtick on your keyboard.
Note: Backticks (`) are not single quotes (’).