Ikke's blog » Webdesign http://eikke.com 'cause this is what I do Sun, 13 Feb 2011 14:58:55 +0000 en-US hourly 1 http://wordpress.org/?v=3.4.1 CSS preprocessor http://eikke.com/css-preprocessor/ http://eikke.com/css-preprocessor/#comments Sun, 23 Dec 2007 18:34:13 +0000 Nicolas http://eikke.com/2007/12/23/css-preprocessor/ Today I’ve been working on a little website project, just for fun. Once again, I wish there was some good CSS preprocessor available, as sometimes (especially during development, before cleaning up the CSS) you need to alter several values in several places to change one little thing.

Some examples:

  • Change some font color, which is used in several classes
  • Change size of objects (eg. if you got 3 divs, which need to span 100%, and originally they were 33% 33% 34%, and you want the first one to be 50% and split the remaining space between the other divs, you need to edit all 3 values)
  • …

This makes editting CSS files very error-prone.

A neat solution for this would be some sort of CSS preprocessor, so you could do things like this:

#define COLOR1 black
#define COLOR2 #ABABAB

.foo {
width: 40%;
color: COLOR1;
height: 10px;
}
.bar {
width: $(100% - .foo.width);
height: $(2 * .foo.height);
}

This is, obviously, just a sample of what could be possible.

Did anyone ever work on something alike, or got some other method to tackle this?

]]> http://eikke.com/css-preprocessor/feed/ 19