Our Sass & Compass Guides and Tutorials are written to span the full gamut of Sass users. In these guides and tutorials, we take into account that you might be just getting started and we do our best to be clear about the subject matter and the tools required to follow along. We will bring you up-close and personal with Sass and the depths of Compass, both project’s documentation, the most advanced features and usages, how to create mixins, “frameworks”, extensions and more.
Posts in 'Guides and Tutorials'
24 May 2013
We’ve written before about the dangers of nesting your CSS selectors too deeply. The Inception Rule is a good one for getting you to avoid some mangled CSS selectors. But there’s actually a lot of benefit to taking this concept a couple of steps farther. What happens when you avoid nesting for almost all of your major selectors?
Continue reading
03 April 2013
One of the coolest features of crafting CSS with Sass is that you can build out a file structure that puts all your components in their right place. BUT the question is … where is the right place? Is there a standard way to structure your Sass files?
Continue reading
09 April 2012
Sass 3.2 is on the way, and there are many improvements to how it handles media queries. Let’s get a jump start on all the new stuff and see how we can use media queries, which are now a first-class citizen, in Sass 3.2.
Continue reading
26 March 2012
One part suggestion to the Sass community to adopt a standard way of structuring Sass modules and one part show and tell. John attempts to leverage his knowledge of large Sass projects to suggest a format for a Standard Module Definition for Sass.
Continue reading
02 December 2011
In part one we talked about how Sass can help with fluid layouts and images. Now we’ll turn our attention to the new kid in town. Media queries are the tool that takes a design from fluid to truly responsive.
Continue reading
22 November 2011
Most people who use Sass are familiar to some degree with the command line. While programs like Compass.app and Scout.app are making it easier to use Sass and Compass without using the command line, hidden gems await those who are willing to do so.
Continue reading
20 November 2011
It’s well known that Sass is an efficient, realiable and precise tool which gives us great power and freedom to make CSS fun and less of a pain to author; however with great power comes responsibility.
Continue reading
11 October 2011
Responsive Web Design is the new wave, right? In this two part series we’ll explore the principles, and talk about how Sass can help. In part one we dive into how Sass can help with the calculations behind fluid layouts and images.
Continue reading
31 August 2011
Sass control directives are the cornerstone of creating libraries for reuse and distribution, and need to be among the very first items on your list of things to learn when taking your Sass skills to the next level. They provide flow and logic and give you a finite level of decision making required by mixins and functions.
Continue reading
28 August 2011
Without question, one of the most powerful and valuable features of Sass is the ability to package up existing code into reusable chunks of code called mixins.
Continue reading
22 August 2011
Sass gladly lets you add calculations and logic in a way that CSS would never abide. But does that mean you should go around adding and dividing just anywhere? Find out how you can use pure Sass functions to make reusable logic more useful and your working Sass file more readable.
Continue reading
30 June 2011
Referencing parent selectors by using the ampersand (&) can be a powerful tool, if used right. There are simple uses of this feature as well as some very complex uses of this feature. In this post we will cover the basic uses of the ampersand (&) as well as link you to a post by Joel Oliveira that goes much deeper on the subject.
Continue reading
29 June 2011
So your friend, co-worker, web-buddy or whomever told you about Sass, Compass … or both. Great! Now what? In this beginner guide we take you through the first steps of getting started with Sass and Compass. We walk you through installation, creating a test project, compiling your first lines Sass to CSS and we even “mixin” a little Sass history.
Continue reading