Blueprint CSS Framework

I stumbled on the BluePrint CSS framework, seeing it used in another blog’s template. I had no idea there was such a thing as a CSS framework. So I’ve been playing around with it this morning.

I first wanted to try it out on a very simple page, and the public end of the bbpointofsale.com site is very simple but uses a lot of floats which are replaced in the framework with the concept of a “grid.” It makes things a lot simpler.

There was one tricky part, the content of bbpointofsale.com is centered ala most Google pages. In screen.css there is a container class that you use when you want to use grid layouts. The default width is 950px so it doesn’t center at all. I was only using 18 columns in my grid and the math for width of columns is columns * 40 – 10 = width so I changed it to this:

.container {width:710px;margin:0 auto;}

Viola! Centered content with the magic of grid layouts!

My initial impression is that the Blueprint CSS Framework is well worth learning and using for reduced development time and great simplicity and easier maintenance. Two thumbs up!

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.