« ボキッ☆(キラッ☆) | 久しぶりの録音 »

3段組 リキッドレイアウト

ホームページのリキッドオオォーーーなレイアウトです。リキッドなレイアウトっていうのは流動的なレイアウトのことです。 流動的なレイアウトってのはつまりこのホームページ。ブラウザを最大化してもサイドバーはウィンドウの右側に張り付いたまま。 そしてこの文字が書かれているエリアが横に広がります。つまりブラウザウィンドウの幅に合わせてホームページの幅も広がります。

で、3段組と一言に言っても色々あるわけでして、
左右がサブコンテンツのパターン
この図のように、メインが中央で両脇にサブがつく場合は、大抵中央のメインコンテンツのみが伸縮する。

おいらが今回いじったのは、
左2段ががメインコンテンツのパターン
こういうやつ。

サンプルのページ

おいらの期待通りであれば、メインコンテンツが二つとも伸縮するはず。


#MainContents {
	width:100%;
	float:left;
	margin-right:-210px;
}
#BOX1 {
	margin-right:210px;
}
#BOX2 {
	width:100%;
}
#Lcolumn {
	width:50%;
	float:left;
}
#Rcolumn {
	width:50%;
	float:left;
}
#SideArea {
	width:210px;
	float:left;
}

とりあえずこんなCSSにしたらこうなった。
3columnliquid1.png

もっとも、実際このレイアウトを使うかと言ったらたぶん使わないような気がするけど。

« ボキッ☆(キラッ☆) | 久しぶりの録音 »

3段組 リキッドレイアウト への Writeback

名前:

URLまたはE-Mail:(※リンク表示注意)

コメント:

情報をクッキーに保存する

trackback URI:

http://iso.tank.jp/puroguramu/3columnliquid_1.tarako

Search

Option

Document

Comment

カテゴリ名変更&新しい楽器がふえたよ
02/14 : そうこ
06/26 : 室井
08/20 : そうこ
09/22 : そうこ
春よ、来い
05/08 : simuzy
05/08 : simuzy
05/12 : そうこ
Google Chrome Extensions
08/15 : Menow
08/19 : そうこ

Tackback

リタリンの処方が打ち切られた
03/27 : ノビじいの鬱々日記
foreshortenedプラグイン改造
01/23 : ISO TANK!

Log

2010年
12月
2009年
10月 9月 8月 6月
2008年
11月 10月 9月 6月 4月 2月
2007年
12月 2月 1月
2006年
11月 10月 9月 3月
2005年
10月 9月 7月

Link