Welcome to the Treehouse Community

The Treehouse Community is a meeting place for developers, designers, and programmers of all backgrounds and skill levels to get support. Collaborate here on code errors or bugs that you need feedback on, or asking for an extra set of eyes on your latest project. Join thousands of Treehouse students and alumni in the community today. (Note: Only Treehouse students can comment or ask questions, but non-students are welcome to browse our conversations.)

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and a supportive community. Start your free trial today.

CSS Sass Basics Improve Your Workflow with Sass Pass Content Blocks to Mixins

Ibrahim Altamemy
Ibrahim Altamemy
2,039 Points

Why should pass block of style to @mixin ?

lets say I have this code:

@mixin myStyle{ color: red; @content }

.mydiv{ include myStyle{ font-size: 1.5em; } } Why I sould wrtie it like previous, When I could write it like this:

.mydiv{ @include myStyle font-size: 1.5em; }

1 Answer

Gari Merrifield
Gari Merrifield
9,559 Points

I would suspect that if you do not first define the mixin, it will be a bit hard to include it later. If you are suggesting leaving out the @mixin line.

But, from the title of the session, I suspect the code is trying to explain the usage of @content, giving a simple introduction, before getting into more complex cases.

From what I can tell, mixins are really shortcuts for later use, so you define it in one place, then include it in as many as you need to. If you later decided to change something included with the mixin, you can make the change in just one place, rather than having to find every place you used that set of styles and edit each one individually.