Mastering Advanced Sass & Workflow with Zurb Foundation

Mastering Advanced Sass & Workflow with Zurb Foundation

You know CSS; you got into Sass as someone told you that it is that better CSS with wings. I get to tell you that you heard it right! Then you started learning it, explored through this Starter Guide and learned basic topics like variables, mixins, nesting, and imports.

[…]

Sass is a preprocessor that will produce clean and efficient CSS code and will cut your development time to half (if not more). Sass has more functionality than traditional CSS. Yes, it's true that Vanilla CSS has its own fun, but you can't reject the fact that stylesheets are getting larger, complex and harder to maintain day by day.

[…]

And here below is the generated CSS output. As you can see we have looped through the maximum number of cells to display per direction to create a block grid. See how quickly Sass calculates everything by itself.

[…]

Here below in the CSS, you can see how these header sizes get's generated through the list thanks to @while loop.

[…]

The Generated CSS is here below, Sass just calculates all by itself.

[…]