Blueprint CSS framework : does it work? Or not?

Chris has an interesting example of Blueprint CSS framework not working. The code looks like it should work, but it doesn’t. And since it was me who recommended Blueprint CSS to him, I felt like I had to understand what’s going on. Or at least find a working solution. First, I tried his code snippet, and indeed it wasn’t working.

<div class="container">
    <div class="span-24 last">
        <div class="span-4 first">4</div>
        <div class="span-10">10</div>
        <div class="span-10 last">10</div>
    </div>
</div>

It was breaking the last DIV into a line of its own, which is not what you or I would expect. After a few minutes of going back and forward, I started with an empty HTML file and started copying Blueprint CSS examples one by one, trying to figure out how to make it work. And here is the code that did it for me.

<html lang="en">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
        <title>Blueprint Test</title>
        <!-- Framework CSS -->
        <link rel="stylesheet" href="blueprint/screen.css" type="text/css" media="screen, projection">
    </head>
    <body>
        <div class="container">
            <div class="span-4">4</div>
            <div class="span-10">10</div>
            <div class="span-10 last">10</div>
        </div>
    </body>
</html>

The biggest two differences between the version that works and the version which doesn’t seem to be an additional DIV with “span-24 last” classes, and the “first” class added to the first content DIV.

With this I have to agree with Chris, that it should have worked.

2 thoughts on “Blueprint CSS framework : does it work? Or not?”


  1. Leonid, if you noticed from my post, “I also tried removing the span-24 div altogether, leaving just the 3 inner divs.”, which made no difference for me.

    The only difference that I see between your code and mine is that you are not loading the print.css file and the conditional ie.css which should be totally irrelevant anyway.

    When I’m done finishing the mock up that I have to do, I’ll investigate further.

    Reply


  2. I tell you what, I’ve been wasting hours, and hours, and hours, on some train wreck of a program that boasts of efficiency. I’ve tried every recommended “Oh…. this is it!!!” out there. This Blueprint should not even be on the net, YouTube, or any other place to waste a persons time. I’ve done every logical thing you could imagine. I’ve seen every video in the world. I don’t think anyone knows what they are doing, because this thing is a hack job. A hack job is an accident, not a planned and well researched device. I doubt there will ever be a ‘way to get it to work’. I wanted to learn how to make web pages more swiftly, and only found dozens of know it all, each solution one more dead end. I’ve got the files properly placed… this thing is incapable of drawing a simple series of blue stripes. I could make a file extract and draw stripes… think about what I’m saying here. This thing is screwed beyond repair. Start over on the project, please!

    Reply

Leave a Comment