I was using Less CSS but it creates too much duplication. Each HTML page I have includes 3 different stylesheets; two are common to all the pages (IE-support and 960 grid system) and the third stylesheet is a custom one made for that page. With Less CSS it was duplicating all the CSS code from the 960 grid system into the third stylesheet.

All I need are variables and functions/mixins/classes...basically a way to put duplicate CSS code in multiple spots.


There are not enough words with which I can describe how awesome SASS is ... it is exactly what you are looking for. It even has a CSS3 superset mode. It is almost god.

And while you are investigating SASS, take a look at Compass (based on sass) - it has ready templates that you can use as mixins for your styles. It includes 960, Blueprint, YUI, and many others (some via plugins).

  • For some reason the Compass website is not available at the moment, the code is here: github.com/chriseppstein/compass and a quick google search "sass compass" can find plenty tutorials to get your started.
    – Evgeny
    Nov 2 '10 at 20:30

It's quite straightforward to use a server-side language to roll your own CSS framework. Here's a basic example in PHP:

header('Content-Type: text/css');
$blue = '#00f';
$largeText = '24px';

h1 {
  font-size: <?=$largeText?>;
  color: <?=$blue?>;

For mixins, you'd need to store the whole chunk of CSS in a string.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.