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

"I hope you can see how much fun mixins can be." Um, no, I don't.

There is so much to unpack from this tutorial, but the thing that bugs me the most is the organization. There is so much emphasis on cleaning up the code (DRY mantra) but it just doesn't appear that way to me. For this video, Guil lost me at the @content part. There is no explanation given as to how/why it's used. I've checked the documentation, but it's still hard to make sense of.

1 Answer

Gordon Munro
seal-mask
.a{fill-rule:evenodd;}techdegree
Gordon Munro
Front End Web Development Techdegree Student 12,807 Points

Hi nicolaspeterson the @content rule allows you to add other styles to mixins where they are included. So when Guil adds the skewed mixin to the header element, he can add specific properties to it as well

@include skewed {
    background-color: $white;
    bottom: -25px;
  }