If I have to work with CSS, it is often a struggle for me and takes a lot of time. And so I always wondered if there is not a better way to work with CSS…
Fortunately, some days ago a CSS framework called blueprint has been released. It defines sensible default values and provides a grid to make layouting a breeze.
I don’t have used it for a complex layout yet, but creating a simple two-column layout with a header and a footer was pretty simple:
<div class="container"> <div class="column span-14"> <h1>Title</h1> </div> <div class="column span-4 first"> sidebar </div> <div class="column span-10 last"> content </div> <div class="column span-14"> footer </div> </div>
I didn’t had to write any CSS myself for this example. The only thing I had to do was to include the blueprint CSS file with:
// screen.css is located in app/webroot/css echo $html->css('screen');
I think with having such a framework, the days of writing all CSS myself are gone ;-)