CSS - Leonid Mamchenkov

Lavish

Lavish is a color scheme generator for Twitter Bootstrap CSS framwork. The colors are based on a specified image.

I wish I knew CSS a little bit better. But then …

I wish I knew CSS a little bit better. But then again, I don’t.

Smashing Magazine : Code Smell And Type On A Grid

When is the last time you got an email and thought:“Man, I wish this email was more complicated!”

Ultimate guide for CSS support in email clients

Designing an HTML email that renders consistently across the major email clients can be very time consuming. Support for even simple CSS varies considerably between clients, and even different versions of the same client.

We’ve put together this guide to save you the time and frustration of figuring it out for yourself. With 24 different email clients tested, we cover all the popular applications across desktop, web and mobile email.

As the number of email clients continues to grow, we’ve decided to simplify the web-based version of the guide to focus on the 10 most popular email clients on the market. For the complete report on all 24 email clients across the desktop, web and mobile email world, download the complete guide in PDF format.

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.