CSS Framework Recommendations

Question

When I say CSS Framework, I don't mean a reset or a grid. I mean a framework like xCSS or csscaffold or compass.

I've been doing CSS for a couple of years, but has not had a lot of exposure to frameworks. Does anyone have any experiences working with them? What are some potential downsides? What frameworks are popular/recommended?

Thanks.

Answer 1

The coolest CSS framework I know about is LESS. It allows you to add variables, inheritance, arithmetic operations, and other coolness using CSS-like syntax-- and it "compiles" down to regular CSS using a build step or server plugin.

Like C to C++, LESS's syntax is backwards-compatible to CSS, so you can simply rename all your .CSS files to .LESS and start adding LESS functionality without learning a whole new language.

As the comments note below, Rails and PHP support LESS already via server plugins. There's also an ASP.NET port in Beta. There's also apparently Django support. And ColdFusion. And so on...

Note that using LESS (as a Ruby executable which spits out CSS files) can be as simple as running it to compile .LESS files into .CSS as part of your build process. The build machine has to be able to run Ruby of course, unless you're using one of the plugins which ported the LESS compiler to that platform's natural code.

Note that xCSS offers similar features to LESS-- I'd not heard about xCSS though. AFAIK LESS is more popular, but others in the community here can weigh in since popularity changes fast!

Answer 2

CSS hasn't really changed much since it was first supported in the Nineties. It's outdated and doesn't follow best practices that have evolved since its conception. I believe the emerging frameworks like xCSS are a result of these shortfalls of CSS.

With this in mind, it's puzzling that CSS frameworks receive a fair amount of criticism. A framework is a tool! You can't really assert than there isn't a valid use case for it. How would a developer know such a thing?

I've been using xCSS to apply the concept of Object Orientated CSS. It's early days but it's looking like it's a very useful tool. It's helping me present an interface to CSS to third parties that have no need to learn CSS. It's helping me reduce duplication of information and it groups CSS attributes and classes into a format that can protect against the software rot of distributed information.

Answer 3

If you use sass I recommend:

1. compass plus sass, which is very handy and powerful to help you speed up your front end workflow.

Here is the url of compass: http://compass-style.org/

1. If you use bootstrap or foundation, I recommend less + winless.

Answer 4

Stylus/AxisCSS is the cleanest combo I've found. In lieu of that, the SCSS/Compass/Bourbon combo is pretty feature rich.

Answer 5

CSS isn't hard enough to justify a using a framework.