css 容器高度100%及相對高寬

* { margin:0; padding:0; border:0;}
html,body { height:100%;}
#box_2 { height:100%; background:#000;}


絕對位置重疊效果

#box_1 { position:absolute; top:0; left:0; width:100%; height:50px; background:#f00; z-index:2;}
#box_2 { position:absolute; left:0; top:0; width:100%; height:100%; background:#000; z-index:1;}


縱向高度相對大小效果

#box_1 { position:absolute; top:0; left:0; width:100%; height:30%; background:#f00; z-index:2;}
#box_2 { position:absolute; left:0; top:30%; width:100%; height:70%; background:#000; z-index:1;}


橫向寬度相對大小效果

#box_1 { position:absolute; top:0; left:0; width:30%; height:100%; background:#f00; z-index:2;}
#box_2 { position:absolute; top:0; right:0; width:70%; height:100%; background:#000; z-index:1;}


實際應用中，可有很多變化，輕鬆實現沒有嵌套的絕對或相對多列豎排、橫排。

IE6.0和FF1.5測試通過