CSS “frameworks” that account for browser irregula

Question

I build websites for a small-ish media company. Unfortunately, around 45-50% of our client base uses IE6, while the other half are pretty much equally split between Firefox and Webkit-based browsers, with a sprinkling of Opera users.

I start every one of my sites with a reset stylesheet similar to Eric Meyer's, with a few modificaions. I've been using the Blueprint CSS "framework" a lot recently, and it's made my life a lot easier, though I am not especially attached to it.

Roughly 60% of my development time is spent making sure the sites I create don't look incredibly different in each browser. I code for Firefox 3 then tweak from there.

Does anyone know of any stylesheets/frameworks out there that attempt to preemptively account for all of those stupid little browser quirks? I know that nothing out there can totally account for all the browser weirdness, but it would be nice to have something a little more solid to start with.

I'm working on creating my own, but it would be nice to have something to start with.

Answer 1

Have you looked at the Yahoo YUI stuff? They have a cross-browser CSS Framework.

Answer 2

Dean Edwards' IE7 library copes with some of the Internet Explorer quirks.

Answer 3

The Yahoo YUI library helps deal with a cross browser rendering issues. Namely, the Reset component (http://developer.yahoo.com/yui/reset/) will revert all browser specific rendering (margin and padding on certain elements for instance), creating a level playing field to start from when designing your site.

Answer 4

Read and inwardly digest Transcending CSS by Andy Clarke, Molly E. Holzschlag, Aaron Gustafson, and Mark Boulton.

It gives a set of techniques for dealing with those quirks you can deal with, and advice on making web sites accessible to older or less capable browsers, or those using other technologies, such as screen readers.

The fundamental thrust is on making sites that degrade gracefully.

It contains lots of links to resources that deal with these issues.

Answer 5

Take a look at YAML.

Answer 6

Blueprint was one of the early appearances in this space, and is considered to be quite mature.

http://code.google.com/p/blueprintcss/

Here's a huge list of available frameworks:

http://www.cssnolanche.com.br/css-frameworks/

There was a lot of interesting debate in the web dev community about css frameworks at the time. Many were worried this violated some stucture/presentation seperation, and introduced non semantic class names and structure.

Some views:

http://jeffcroft.com/blog/2007/nov/17/whats-not-love-about-css-frameworks/

http://playgroundblues.com/posts/2007/aug/10/blueprints-are-not-final/

http://www.markboulton.co.uk/journal/comments/blueprint_a_css_framework/

http://peter.mapledesign.co.uk/weblog/archives/blueprint-semantics-markup-frameworks