Sass could potentially be called CSS 2.0; it has some really nifty features that allow you to write your code in less time and with more flexibility. In today's article, we will be working the basics!
What is Sass?
Sass is simply a different way to work with CSS. It allows you to keep your CSS code very simple and helps increase readability. It takes something like this:
And turns it into:
You can check out Sass at http://sass-lang.com/
What is Compass?
Compass makes working with Sass even easier. The author, Chris Eppstein, has also included some converted frameworks such as Blueprint, YUI, and 960.gs. It also easily integrates with Ruby based projects, but is just as easy to add to any other project. Compass is open-source and is extremely well documented. Check out the source and documentation.
Installation
Both Sass (which is part of the Haml Project) and Compass are installed through RubyGems. If you dont have any clue what I am talking about, check out "Step 1 - Installing Ruby on Rails" of my previous article Ruby on Rails for Designers, and follow the steps down until you hit the section named "Installing Rails".
To install both of these gems, we can just run a single command:
(sudo) gem install haml chriseppstein-compass
As long as it says that it successfully installed both gems, you are good to go!
Project Setup
If you are working with a Ruby-based project then check out the documentation as it will explain how to get it working with your specific framework, but I'll assume we are working with a simple HTML or the like project.
The compass command has a lot of options, and if you run compass --help, you might see:
FYI: The next to top line that says "Loading haml-edge gem." is because I use the latest version, so you don't need to worry about it if yours says something different.
Now we are going to start our Compass project. To create run the following command (including the trailing period, that tells compass where we want to make our project!)
compass --sass-dir=sass .
And you should see:
Where initializing, Compass would normally default to having the Sass in a folder name src, but I wanted to change that so I added the option. If you look at the folder, you should see a file named config.rb and two other folders.
The config.rb is the configuration that Compass looks at, but most of the time you wont need to mess with this. Also, like the output from the creation command says, we have three ways of updating our CSS from our Sass:
compass - using this option, you would have to be in the correct directory, and then Compass would compile your Sass once.compass -u path/to/project - this is about the same as the command as above, but you do not have to be in the project directory, and rather pass in it with the command.compass --watch [path/to/project] - this command is pretty awesome in that it watches for any changes to your Sass files and will automatically recompile them whenever a change is detected.Now that you know how to setup a project, I'll explain some of the "rules" of working with Sass
Sass Syntax
Normally when writing CSS, you would write something like:
#header {width: 900px; background:#111;}
#header a {color:#000; text-decoration:none;}
One of the problems with that is that you are repeating the same name many times. Lets make this into Sass. I am going to be working in the screen.sass file, so delete everything and your Sass would like:
#header
:width 900px
:background #111
a
:color #000
:text-decoration none
Personally, that it much easier to read and write this way, no curly braces or semicolons. The way that Sass understand the nesting is through indentation.
The first selector is not indented at all so the final CSS with start with that. Also, all properties, (so color, height width, etc) begin with a colon. So for the properties for #header they are indented. It does not matter if you use tabs or spaces, but you must remain consistent, otherwise you will see an error (which I'll show in just a minute).
So now that you have your properties, we have our next selector. Since this is indented to the same as the properties, the CSS output will be #header a ...
Now that we are this far, lets try compiling: (in your project directory)
compass
And voila!
Let's say that you didn't indent everything the same, Compass would error:
Now, once you know CSS, Sass wont be very much of a learning curve, as the main difference when getting started is the different formatting rules. Next, we will get working with some of the more advanced (but cooler!) parts of Sass.
Features of Sass
Variables
One awesome feature of Sass is it's ability to use variables. An example:
!link_color = #fff
#header
:width 900px
:background #111
a
:color = !link_color
:text-decoration none
Compiling this, would give you:
Math
You may be laughing at this title, but its true, you can do math in Sass! For this demonstration, we will be using Sass's interactive mode, so run:
sass -i
And a little messing around would give you:
Or a more visual approach:
#111 - #999 = #000Apart from addition and subtraction, you can also multiply and divide:
#398191 / 2 = #1c4048To exit the Sass interactive mode, keypress Control-C, and then type "end", and press enter.
Mixins
If you have ever heard of keeping your code DRY, DRY means "don't repeat yourself." Mixins allow you to do just that. For example, with the gaining popularity of rounded corners, you may want to create a mixin to handle that, so somewhere, (not under a selector) you would add:
=rounded :border-radius 4px :-moz-border-radius 4px :-webkit-border-radius 4px
And to use, you would do something like:
#header :width 900px :background #111 +rounded
And when compiled:
Lets say though, you may want the border radius to be variable - well you can have a mixin expect to be passed some values. Changing our mixin, it would look like:
=rounded(!radius = 4px) :border-radius = !radius :-moz-border-radius = !radius :-webkit-border-radius = !radius
And then to use you could use what we did before, and then the value would default to 4px, otherwise:
#header :width 900px :background #111 +rounded(8px)
Importing
Sass also has the ability to import other Sass files, so lets say you wanted to import a file (in the same as this sass file), you would add:
@import reset.sass
This feature is really nice in giving you the ability the keep extraneous styles outside your main file. For example, you could also keep a mixins sass file that you copied around projects and then a simple import would add that code it - no copy and paste.
Conclusion
I hope you understand the basics of using Sass and Compass and will possibly use it in your next project! Now, if you are like I was when I found Sass, and said "I don't need this!", give it a try. I've switched over to it for all of my recent projects and I really enjoy working with it.
Links
Here are a few links that may help you along the way:
- The Sass Reference contains what I talked about today and much much more. Definitely worth a look if you are serious about Sass.
- The TextMate bundle for Sass is great and I use it often.
- The official screencast for Compass, while long, covers about every base with Compass and Sass.
- Follow us on Twitter, or subscribe to the Nettuts+ RSS Feed for more daily web development tuts and articles.
Related Posts
Check out some more great tutorials and articles that you might like
Plus Members
Source Files, Bonus Tutorials and
More for $9 a month for all TUTS+
sites in one subscription.
User Comments
( ADD YOURS )atomer August 31st
definitely gonna try this! is awesome!! thanks
( )Brian Klepper August 31st
Never heard of this.. Thanks for your input!
( )Muhammad Adnan August 31st
me too, will give it a try..
( )Drazen Mokic August 31st
Hm this looks very very awesome!
Just to dont get it wrong:
- I write CSS in SASS syntax
- I compile it
- The compiler returns normal CSS
- I can´t use the SASS syntax finally ( even not with a server side compiler or something )
Right?
( )Derek Reynolds August 31st
Right, but but you can setup some kind of auto deployment that will automatically compile SASS for you.
( )Chris Eppstein August 31st
Precompiling your sass is optional for Ruby on Rails and Merb. If you don’t, Sass will generate CSS once when it serves the first request.
Ethan September 1st
You can run “compass -w” in the command-line and have it automatically compile, yes.
Ulf August 31st
I think you mixed up your example images for describing SASS. You might wanna swap the two!
( )dc August 31st
Yeah the first two images are swapped, I was confused for a little bit wondering what the hell SASS actually did.
( )Michael September 1st
Absolutely. I couldn’t make head or tail of what the author was on about until I skimmed through the article because of it…
( )Hitesh August 31st
How to use this on window
( )Eric B. August 31st
I like the idea of being able to use math in CSS, but couldn’t that break some selector names?
( )crysfel August 31st
you don’t use Math in CSS, you use Math in SASS, which it’s a ruby language.
( )Jonathan Yarbor August 31st
interesting, but I can’t say that this is a real improvement over css. Interesting article and I love to read about new technologies!
( )Jonathan Yarbor August 31st
and the add to accomplish auto completion and repetition I would use php or another type of prepared programming language.
( )Nathan Weizenbaum September 3rd
Give it a try before you judge too hastily. Convert a stylesheet or two by hand, just to check it out, then see what you think.
( )Jax August 31st
Never used this. Definitely i will try it.
you can do math in Sass!
( )Is this really useful?
Fadel August 31st
Thanks for your ping
( )Drazen Mokic August 31st
Hm ok, thats not so nice as i thought.
When i write CSS code i always drop some lines and then look at the browser if everything is correct.
Now i have to Save the .css -> compile it -> look at the browser.
This compiling step is hardcore annoying during the development process.
( )Chris Eppstein August 31st
If you run “compass –watch”, you don’t have to do anything except save the sass file and reload your browser. If you’re working on a ruby based project, it can be configured so that you don’t even have to run the compass command to recompile your sass files.
( )Simon August 31st
Yeah, I don’t really get what the benefit is either. Seems like a hassle for not much added readability.
Good to know that there are options out there though.
( )AjithRindia August 31st
I agree.
Chris September 1st
you run compass in the background and it generates the compiled css in realtime.
I’ve been using compass for a while now and there is no way i can go back. SASS and HTML are much more isomorphic in structure. I find i can create css a LOT easier.
Its more readable and you repeat yourself less
jaded September 2nd
ditto. pass.
Philipe Farias August 31st
With Compass you can use the command:
compass –watch [path/to/project]
So it will compile automatically every time you save the sass file.
( )Eric Holmes August 31st
You can instruct the compiler to “watch” for file changes and automatically compile it. So your workflow would hardly change.
This looks great, going to use it for my next project.
( )Miles Johnson August 31st
So whats the benefit of using this?
Seems like it would be easier and faster to just write it normally.
( )Paul Gendek August 31st
“Sass could potentially be called CSS 2.0″
huhwhat?
( )Rafyta September 1st
Yeah, I also thought there was something “else” called CSS 2.0
( )Aayush August 31st
nice….I will definitely use this…although I wish it had a simpler installation…I don’t work in ruby at all and therefore ill have to download ruby to run this….I have read about saas before, left it untouched for the same reason…too much setup…but ill definitely use it this time….
( )Chris Eppstein August 31st
Ruby is not hard to install and once it is installed, compass is trivial to install. It looks like a bigger requirement than it is. Plus there’s lots of great ruby software that you’ll be able to use once you have ruby installed.
( )Yorick Peterse August 31st
Don’t see the benefit of using this. Also, CSS 2.0 already exists :B
( )Chris Eppstein August 31st
I think the author meant that sass is akin to a next generation of stylesheet syntax.
The benefit is in using simple abstractions to design your web pages that apply battle-tested styles that work in every major browser or degrade gracefully.
Also, Sass enables you to make your stylesheets more maintainable by making changes simpler to enact via the principle of DRY.
( )Joe August 31st
I also dont see the benefit of using this
( )Kyle August 31st
Looks very cool. CSS can get complex very quickly, this looks like a good way to improve organization.
Which TextMate theme are you using? I want it!
( )Kevin Quillen September 1st
‘CSS can get complex very quickly’
Only when done wrong?
( )Martin August 31st
i use sass and compass (with haml) in my rails projects. just love it!
thanks for the tut though!!! amazing choice!
( )Robbie August 31st
This is a neat “Look what I can do” thing I guess, but honestly it seems convoluted and unnecessary. CSS isn’t very hard as it is nor does it take long to write. Learning a new “framework(?)” or whatever this is seems like a real time killer in itself. Also, why would I want to install something just to use CSS in a different way? ALSO, this would make migrating a site or bringing on a new developer a headache I think. I don’t know, maybe I’m just being contrary.
( )Chris Eppstein August 31st
Compass was built from real world experience and extracted from real world projects. It is not a technology demonstration. The users who use it every day can attest to what a big difference it makes to their productivity.
New developers pick it up the basics within a couple hours and can be great at it within a week or so — but then again, I hire wicked smart developers and I wrote the project, so my experience might not be typical.
You’re right to be wary new technology, but compass has been around for over a year now, has thousands of passionate users, and is growing by the week. I think it has reached the point where it warrants you at least giving it a try with an open mind.
( )Paul du Coudray October 11th
Robbie and others, I’ve been designing websites and web applications for years now, and compass/sass has been the single most revolutionary thing in my working life… I can’t say enough good things about it. I used to be a print designer with absolutely no technical background at all, and I made the effort to learn this and it paid off within a week.
colin August 31st
Huh, glad I’m not the only one who doesn’t get it. Skimming through the tutorial, I was really confused as to where I’d be saving time or increasing workflow…
( )Dan August 31st
So let me get this straight…
1. Code all your css in sass because you can drop a few names here and there.
2. Compile sass.
3. Get exactly what you’d have anyway with the added bonus of additional server resources.
4. ????
5. Profit?
I’m going to stick to my method of just writing nice, clear and understandable css as I go along.
( )Kyle August 31st
The commentors who don’t see the use in something like SASS probably have not worked on large web projects before.
In an agile team, with lots of rapid changes, the quality of CSS code quickly degrades. Tools like SASS make CSS easier to maintain.
I haven’t used SASS yet, but I likely will use it (or something similar) on new, large projects.
( )dmc September 1st
I work on large scale web projects, and I can’t see the benefit of this.
Without trying to be rude, you’re extolling it’s virtues, but also saying you’ve never used it, so perhaps you shouldn’t assume that people who don’t see the benefits are inexperienced.
This really does seem pretty pointless.
( )Mosselman September 1st
Agreed
Miles Johnson September 1st
Lol its called good CSS developers and GIT/SVN.
( )adrusi August 31st
I was waiting for a tutorial on this
( )IgnacioRV August 31st
I haven’t worked with SASS nor Compass yet, the few web projects I have worked on were too small and didn’t require a tool like this.
However, I will play with it to see how it behaves…
Thanks!
( )Brett August 31st
Seems interesting. I like the ability to add variables into the css. That would come in handy on larger projects when a client decided to change something. Don’t need to find all the instances, yet if you organize your stylesheet, you wouldn’t need to do much searching. To me, the benifits of SASS do not out way the drawbacks, i.e. having to compile to preview in browser. Yet maybe for others, they do.
( )Ben D August 31st
Awesome guide.
Discovered Compass a few months back but never go it working. Now I am all set up
Thanks.
( )paul August 31st
CSS for Ruby snobs.
( )I’ll stick with the regular syntax, thank you
Manu August 31st
I think LESS is much better than SASS.
( )Danielw August 31st
I don’t really see the big difference between writing css the old way or writing it with SASS, there is a few shortcuts in SASS but if you have to compile it before you can use it, i don’t really see what you gain from using SASS….
#header {
margin: 0 50px 0 0;
border: 1px solid #ccc;
}
or
#header
:margin 0 50px 0 0
:border 1px solid #ccc
i choose the good old way
( )Hassan August 31st
The normal css seems easier to me. I don’t like it’s syntax.
( )Pedro Miguel Cruz August 31st
Please, do not forget of the new born alternative: lessCSS. Inspired in Sass from the author of http://www.usabilitypost.com/ – http://lesscss.org/
( )Eric Holmes August 31st
What TextMate theme is this?
( )Albioner August 31st
One word: Variables
( )Jikaido August 31st
Has anyone used CSScaffold ?
It seems a bit more transparent then SASS and seems to offer some of the same features.
( )Ben August 31st
I don’t like it. Seems like too much hassle and the effects are not even that great. It would be better if it could be done through something like PHP or JS. But I wouldn’t want to install something on my server.
( )Alex Coomans August 31st
Hey guys – thanks for the comments. Yes some people may not want to use this, and while it may seem weird to use for a small project, I really like working with it. Kyle is defiantly correct with the size of the project: It helps a lot when working on huge projects.
And Ben, nothing is installed on your server. You compile it locally. I normally run compass –watch and it feels like I was still using CSS, just that I am happier.
Hope you enjoyed the article!
( )Christopher August 31st
i dont know why i should use/learn sass if i can work faster with normal css ?
( )Chris September 1st
If you try working with sass properly youll realise you cant work faster with normal css.
( )John DuHart August 31st
Wish you would give us some ports in your article though, I don’t like having to install ruby to use this, as nice as it is.
( )Dels August 31st
1st, is this really for Ruby? how about PHP/ASP.Net user?
( )2nd, how much this solution viable to css? after all their were only different way to write CSS, what we should know was how to write effective and efficient CSS codes (including IE hacks)
3rd, didn’t this mean we reintroduce a new language just to do the same old thing before? And how about learning curve for all new web designer?
4th, my personal opinion was this is not revolutionary enough compared to JS framework like JQuery or prototype
Michael Mokrysz August 31st
Think the editors missed a few hits with this really. Whilst it looks useful by the end, the start should have been rewritten to show off why it’s useful immediately, rather than just reading like ‘wow, look, an alternate but essentially identical way of writing css’. Not to mention it should have been CSS 4.0 rather than 2.0.
Good tutorial otherwise though.
( )Brian Temecula August 31st
I am with the others who say CSS is fine the way it is. The only case where I might not have a standard CSS file would be if I was dynamically generating it through PHP. I just don’t need anything else.
( )Marcos Cerutti August 31st
I like Ruby, I do like PHP as well, but lets be honest, let’s keep things on it’s right place. css is for layout and design, so, compile css sounds weird… install a gem? and for the guys who aren’t used to RoR? and well, if a designer start to work on 2 or 3 projects at same time? will they need to install passenger? Sounds a good idea, but Im not sure if would work for “agile” development. Don’t know, Actually, I didn’t try it myself… maybe I would change my idea
( )Benjamin Reid August 31st
It’s a nice insight but there’s been quite a few alternative CSS shorthand techniques but I have no problem writing it quickly and these methods just seem to try and fix something that doesn’t need fixing.
Until we have something that does what jQuery does for JavaScript, then I’m not too bothered.
( )andreas September 1st
variables should definitely be supported in css…. this is an interesting workaround….
( )Shane September 1st
I’ll be honest – I didn’t read this article, since I came to a very quick conclusion about how useful it would be.
( )Dj September 1st
Really wish there were an answer to obtaining variables from within “real” css – which is about the only real advantage I see in sass. The disadvantages seem daunting even when you forget the extremely user-unfriendly installation process. Does this mean that you make a change in your css then have to re-compile before you then can reload and see the change in your test browser?
( )Kevin Quillen September 1st
Well, nice written tutorial anyway.
At first this sounded somewhat promising, until I saw Ruby and the console was involved. It quickly got far too complicated and complex and doesn’t seem to improve efficiency or productivity at all. This seems like something hardcore programmers would be into, only because it involves Ruby and ‘2.0′.
I can’t see myself using this. Once most people learn CSS and become adept with it, they could style an entire site before they could finish reading this article.
( )Mosselman September 1st
There is no advantage to this as far as I can see with the exception of what you call “mixins”.
Why would I want to learn a different syntax to do the very same thing, but include a compile step in the middle? It will take longer to create the same things. Not only that, but you will have to teach new developers in your company or team how to use Sass.
I agree with others, show us something that does for CSS what JQuery does for Javascript and i’ll be impressed.
Also, the size of a project is irrelevant. If you don’t agree, please explain in detail why it is. How can a big project benefit from this OVER normal CSS?
( )OldSchoolCSSRules September 1st
Why don’t you write your CSS that way in the first place? After working with CSS for a few years I ended up structuring my css code in way very similar to this Sas output.
If you let people rely on tools like these they will never learn how to write lean manageable CSS code by hand.
If you have big projects, make sure you employ good front-end developers. Unfortunately this doesn’t happen very often and therefore some ‘god-complex’ programmer came up with a total useless program designed to help the ‘designers’ write more manageable code…
This is actually insulting.
( )Chris September 1st
This tutorial is a lot more complicated than it needs to be. I love using Compass+Sass because its very simple. CSS is way too verbose.
( )Ethan September 1st
What…the…hell… I submitted an idea for this a couple weeks ago and was turned down! WHAT THE HELL.
( )Benjamin Reid September 3rd
Maybe they… beat you to it?
( )Juan C Rois September 1st
Nice tutorial, thanks for your effort. It is always good to know that there are other ways of doing things, however it seems to me that it is always better to keep it simple. This method reminds me of the “microsoft” way of doing things, making them more complicated than they ought to be!
( )Taylor Satula September 1st
Cool thanks for the tut
( )yann September 1st
never heard of this before. Gonna try it out tomorrow, thx
( )Drazen Mokic September 1st
Ok i updated my mind *g*
I used it now a while ( 1 whole day
) and i have to say its very nice.
With -watch you can let it watch your .sass file and on any change ( when you save again the file ) it will compile it automagicly.
( )Janne Jääskeläinen September 1st
Fail.
Having variables in CSS would be definetly nice, but I really don’t see how this method would be viable in real world (TM). Adding one more complex solution in the boiling pot doesnt help, if CSS is pulp of an ID-mess anyway.
“The commentors who don’t see the use in something like SASS probably have not worked on large web projects before.”
Yeah, that must be it. Or could it be that the “solution” is worse than the original problem…
( )Bret September 2nd
if you’ve every worked on a project with 1000+ lines of CSS code you can really appreciate how setting global variable for colors, margins, and other common elements can be. it’s the equivalent of using include files in PHP or partials in rails. you change your code once and it updates everything…
( )Jason Calleiro September 1st
Mixins and variables are what really make sass amazing.
( )JOnas September 2nd
Hm…
( )Ashwin September 1st
Awesome tutorial. I am new to CSS and Web Design and nothing can be a more clean way to create stylesheets
Thanks for sharing
( )Anon September 2nd
omg, this could save so much time, too bad its only for ruby.
( )Rachel Wilson September 2nd
Would love to use this but sadly I use VWD to do my websites…
Unless they a version to use with it, I won’t be able to.
Really awesome though. Hopefully someone will come up with an .NET equivalent, if possible.
( )w1sh September 2nd
I defended this when it first popped up on Reddit.
The coolest thing about this is that you can edit multiple regions, in multiple projects, at the exact same time.
For instance, if you wanted to change the background color of your headers and footers in every page on your website, you could.
You can modify all the typography on your site just by modifying one element.
It’s ridiculously awesome and no one seems to grasp it’s potential.
Having difficulty installing it though…
( )Anton Agestam September 2nd
“It also easily integrates with Ruby based projects, but is just as easy to add to any other project.”
How do you do that then?
( )Alex Coomans September 2nd
Anton – I discussed how to use it with a project that is not on of the Ruby ones Compass has support for.
( )Janne Jääskeläinen September 2nd
“For instance, if you wanted to change the background color of your headers and footers in every page on your website, you could.”
Err… and this cant be done with CSS?
“It’s ridiculously awesome and no one seems to grasp it’s potential.”
I disagree. People dont see the potential, because it isn’t there. I prefer KISS over DRY any day.
Sorry for sounding so negative.
( )Kevin Quillen September 2nd
#header, #footer {}
Not sure what CSS can’t do there. I don’t get the point of this article.
( )Diego SA September 2nd
Interesting, but won’t be easier write CSS normally? I mean, we are used to write it as it was created. Using Sass could delay our process. Besides, using variable will complicate our life.
( )I do prefer to write CSS classes and ids than have to make a CSS-based advanced programming.
Alex Coomans September 2nd
Guys thanks for all the positive comments.
As for the negative ones….
Yes this is a Ruby based tool, and Ruby is easily installed on just about any system out there.
While some people can write CSS faster than Sass, I have found that I can work with Sass much more efficiently than I could before I started using Sass.
Also, Sass is not a whole new different language. It is simple some rule changes to CSS.
And for the confused….
I based this article for projects that are not based on Ruby so thus wouldn’t have Compass built-in support. The steps are all meant for an environment in any language, and is not tied to any specific language. You do, however, need Ruby to use Sass.
And once you get Sass and Compass installed, working with Sass is extremely simple.
( )Bret September 2nd
sass is great. with haml, it’s definitely cleaned up code on every project i’ve used it for and made it really easy to modify/update code. i knew it supported variables but wasn’t aware that i could do math with it… for those users w/ css who want to convert you can use css2sass to convert your existing code
( )theromanempire October 2nd
its amazing reading the comments how many people just dont get what this is, how it actually works, and how it is beneficial.
maybe the tutorial isnt written that great…
( )Majic3 October 4th
I have loved the idea of compass since seeing it; but am now looking at using csscaffold since I use php more than ruby so for me csscaffold is my preferance over compass (for php users this is a must see).
Once you grasp the power and immediacy that sass provides and compass further enabls you to harness I am sure many will adopt it for regular use.
Its a great concept beacuse you can produce a custmised bespoke css out that is clean by compiling your sass using mixins (patterns) which can be repeated in sequences if need be. You can use a framework and map classes from the framework to your own liking. This way you can get the benefits of using frameworks but without the hassles. Much of the concepts used within sass can (when modfied) be to css (indenting etc — of cource sass nests as well as embeds therefore you have to type less which means fewer typo mistakes)
Seeing the comments above its clear that many don’t see this. Though still in the first foot steps of sass use myself (perhaps Chris or Andrew could clarify / epxand upon what I am trying to convey)
+customise output
+(re)use existing patterns & framworks
+repeat sets of classes etc (typography h1-h6 may be made from a mixin with margins font size altering with each interation)
+use mathmatical expressions
+use contsants so yes you can change #header, #footer bg colour quite easily with css across 1,000s of pages but sass takes this further eg you could use constants and math to alter many such settings within nested sass sheets rules and uses of mixins in your screen.sass or whatever your master project sheet is called — but you could also use sass to create sets of sheets which use & resuse sass to produce css sheets — a web dev could set up a sass libs (mixins & frameworks) from which client work can be styled rapidly
- its adding another part to the process of production
( )- sass requires strict formating that css does not (messy css is hard to maintain)
- at times you may find that
Chris Eppstein October 4th
For those of you who don’t understand the point, I wrote a blog post for you to explain the benefits:
http://chriseppstein.github.com/blog/2009/09/20/why-stylesheet-abstraction-matters/
( )Martin October 12th
actually a really inspiring discussion
first i didn’t get it, now i start to see how it could pay back in time. since it’s abstract in comparison to plain css it needs some thinking in order to be productive for you. i guess once i start using it and start thinking out of the box it could really pay back in time. unless by that time something else shows up… 
but taking a risk also always pays back, one way or another. thanks for the article and the patience
( )Maya November 9th
i see its great as long as you started working with it a lot, the first time i used it, it took me a lot of time to write the syntax and to think how to write less. the thing that i need to know, is the compiled css file size good enough for the project performance?
( )