4

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.

2 Answers 2

5

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).

1
  • 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. Commented Nov 2, 2010 at 20:30
1

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

<?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 and acknowledge you have read our privacy policy.