What is the point of CSS Frameworks?


What is the point of these CSS Frameworks? I don't understand them. When I look at them, all I see is boring layouts that seem overbearingly-difficult to adapt to your own unique designs.

Is this the case, or am I just missing something here? I'm referring to (frameworks in general) things like Blueprint, Less, Skeleton, 960 Grid system, Base, Gridless, etc etc etc.

I know this is a really simple thing but I just don't get it. I have searched but have not found anything that helps me to understand what the big deal is. When I look at their code, all I see is mess. Weird class and id names all over the place.

(This isn't a rant or complaint by the way, I just really don't get it.)

Problem courtesy of: spike.y


CSS frameworks are pre-prepared software frameworks that are meant to allow for easier, more standards-compliant web design using the Cascading Style Sheets language. Most of these frameworks contain at least a grid. More functional frameworks also come with more features and additional JavaScript based functions, but mostly design orientated and unobtrusive. This differentiates these from functional and full JavaScript frameworks. -Wikipedia


  • They can help you learn CSS. You might just literally not know how to pull off a solid multi-column layout. A framework may be a good place to get your feet wet understanding how CSS works.
  • They provide code that you just don't need to write from scratch every time, like resets. I've long been a proponent that the star selector (*) margin/padding reset is a fine reset. I use it all the time. But... if you are starting a major new project that is going to be loads of pages, live for years and years, and will grow over time, you should invest right away in a more robust reset. All these frameworks start with brilliant resets that cover all the bases and will have you covered for years to come.
  • They relieve cross-browser concerns. You can't undervalue this. We've all felt the burn of finding out our sites are borked in some browser or another at a hugely inopportune time. Frameworks are built to bring their magic to all browsers.
  • It helps you build good habits. Like including a print stylesheet in your projects. I always intend to build one, and I often do, but the chances are a lot higher that I do it if I have one there from the get-go.
  • They encourage grid based design. Which is a good thing. Grids don't mean boring! They just help you achieve better readability, scanability, balance visual weight, flexibity, expandability, and just overall page page cohesiveness.
  • They come with documentation. If you need help getting started, framework generally come with some support files. This can be particularly nice if you are designing a site you will be handing off to a client. You can just let them know what framework you used and refer them to that documentation for support requests.
  • They lay groundwork. If you are using something like YUI, your life will be a lot easier if you use All-YUI-Stuff-All-The-Time. It's built to work together and built for expandability. -CSS-Tricks

Also see: Comparison of CSS frameworks

Solution courtesy of: Chankey Pathak


There is currently no discussion for this recipe.

This recipe can be found in it's original form on Stack Over Flow.