00 HEAD SITE-TITLE

01 RH HEADLINE

1234567890
testtextTESTTEXT
テストテキスト
1234567890
testtextTESTTEXT
テストテキスト

02 LH INDEX

1234567890
testtextTESTTEXT
テストテキスト
1234567890
testtextTESTTEXT
テストテキスト
1234567890
testtextTESTTEXT
テストテキスト
1234567890
testtextTESTTEXT
テストテキスト

03 RH MAIN

How to build v4.0 > Layout sample > Lay01

フロートを利用した 2 列レイアウト type 1
( CSS 無効時を意識した互交レイアウト )
幅固定 / 全幅ヘッダ - 2 列コンテンツ - 全幅フッタ
( LH:2 段カラム / RH:2 段カラム )

Statement
v40lay01.htm
構造
HTML 4.01TR (DOCTYPE include URL)
CSS level 2.1
CSS フロートレイアウト(一部 position:absolute )
幅 750px 固定
技術
レイアウトは CSS のみで制御しています(テーブル・スクリプトフリー)。
既知の問題
BOX 01 と 02 の Height が 01 > 02 になった場合、03 と 04 の上端がそろってしまう。
備考
CSS 無効時は 全幅のブロックがページ上端から下向きに BOX 00 01 02 ・・・ 06 と並びます。
性能試験
テストブラウザ:IE6, IE7, Firefox 3.5, Google Chrome 3.0, DOCOMO P906i
Another HTML-lint : 100pts
W3C Markup Validation Service Result: Passed
W3C CSS Validation Service : No Error Found
UPD / rev.
2010-10-17 / v4.00.9a17

1234567890
testtextTESTTEXT
テストテキスト
1234567890
testtextTESTTEXT
テストテキスト
1234567890
testtextTESTTEXT
テストテキスト
1234567890
testtextTESTTEXT
テストテキスト

04 LH MENU

1234567890
testtextTESTTEXT
テストテキスト
1234567890
testtextTESTTEXT
テストテキスト
1234567890
testtextTESTTEXT
テストテキスト
1234567890
testtextTESTTEXT
テストテキスト

1234567890
testtextTESTTEXT
テストテキスト
1234567890
testtextTESTTEXT
テストテキスト
1234567890
testtextTESTTEXT
テストテキスト
1234567890
testtextTESTTEXT
テストテキスト

05 FOOT NOTEs
06 HEAD SEARCH