Sass Mixin Syntax

Create reusable groups of declarations with Mixins. A good use case is when many vendor prefixes need to be used. Code it once and call it anywhere:

@mixin column-count($nb-columns) {
  -webkit-column-count: $nb-columns;
  -moz-column-count: $nb-columns;
  column-count: $nb-columns;

// Calling the mixin:
.two-columns { @include column-count(2); }
↓ Here's a great React course we recommend. Plus, this affiliate banner helps support the site 🙏


The above snippet will yield the following CSS:

.two-columns {
  -webkit-column-count: 2;
  -moz-column-count: 2;
  column-count: 2;
  Tweet It

🕵 Search Results

🔎 Searching...

Sponsored by #native_company# — Learn More
#native_title# #native_desc#