全然詳しくないしほとんど使えてませんが、CSSフレームワークのお話。
オタクのメル友・彼氏彼女のサイトは、
blueprint（http://www.blueprintcss.org/）
というcssフレームワークを使ってデザインしました。
これを使うと、例えば↓のように書くとグリッドを左右に18:6（最大24カラム）で列を分割する事ができます。
<div class="span-6"> left </div> <div class="span-18 last"> right </div> </code>
これで簡単にヘッダーフッター、サイドバーのグリッドレイアウトが作れました。
しかし、色々と問題があったのです。
blueprintだけでなく他のフレームワークにも言える事ですが、
h1,h2,body, table・・・等々、あらゆるタグに初期値が大量に設定されているのです。所謂reset.cssですが、ちょっと酷い気がする。
これが邪魔でした。tableタグには変な罫線が設定されてるし、aタグには変な画像が設定されてたりして、
結局片っ端からそれら初期設定を外しまくって使いました。↓実際こんなのが300行ほど初期設定されてます。
html { font-size: 62.5%; font-family: "Liberation Sans", Helvetica, Arial, sans-serif; } strong, th, thead td, h1, h2, h3, h4, h5, h6 { font-weight: bold; } cite, em, dfn { font-style: italic; } code, kbd, samp, pre, tt, var, input[type='text'], input[type='password'], textarea { font-size: 92%; font-family: monaco, "Lucida Console", courier, monospace; } del { text-decoration: line-through; color: #666; } ins, dfn { border-bottom: 1px solid #ccc; } small, sup, sub { font-size: 85%; } abbr, acronym { text-transform: uppercase; font-size: 85%; letter-spacing: .1em; } a abbr, a acronym { border: none; } abbr[title], acronym[title], dfn[title] { cursor: help; border-bottom: 1px solid #ccc; } sup { vertical-align: super; } sub { vertical-align: sub; }
そして最後に残ったのは結局 spa-6 等のグリッドの部分だけでした。
今次のサイト作成を始めているのですが、前述の理由からblueprintを使用は見送りました。
しかしグリッドだけは欲しいので色々探していたらいいものが見つかりました。
gridsystemgenerator（http://www.gridsystemgenerator.com/）
このサイトは、いくつかのフレームワークからグリッド部分だけを抜き出して、width・カラム数・マージンを自由に設定できるものです。
新サイト作成にあたって、1kb GRID を width=970px、カラム数=24、マージン=10、で使ってみることにしました。
（1kb GRIDを選んだのは、最小構成でグリッドだけ欲しかったため）
IEでの表示が気になりますが、使ってみたいと思います。
ちなみに1kb GRIDこんな感じのコードです。
<div class="row"> <div class="column grid_16"> left </div> <div class="column grid_8"> right </div> </div>
↑のコードをもう少し付け足して、以下のようなレイアウトを作ってみました。とても簡単です。
