Rubellum fly light

ほぼPHP日記

960 Grid System がヤバい便利

960 Grid System」はCSSフレームワークです。
CSSフレームワークっていうと「?」って感じですが、レイアウトの形成(カラムの並び)を補助してくれます。
デモページを見ると、何やってるのか一目瞭然です。


一般的なブログレイアウトである2カラムタイプ(ヘッダ、左メイン、右メニュー、フッタ)は、

<div class="container_12"><!-- 12等分 -->
	<div id="header" class="grid_12">940px(両端に10pxの余白)</div>
	
	<div id="main" class="grid_9">700px</div>
	<div id="side" class="grid_3">220px</div>
		
	<div id="footer" class="grid_12">940px(両端に10pxの余白)</div>
</div>

こんな感じになります。
いちいちfloat定義しなくて済むので楽ちんです。