[相容性問題] 遇到版面設計問題~!!! 無法為網站定位~!!!

網址: http://119.246.142.123:81

先說說我遇到的問題~~~
我剛剛開始設計一個新網站時出現排版問題,
在IE,Opera,FireFox 中,
#main 無法出現 Scroll Bar。

詳細
使用者進入網站後,
點擊 #header 的分類按鈕後,
#main 會自動滾動到合適位置。
另外, 我想網站的高度跟隨瀏覽器的像數而變化。

包著 #main 的 td height 是 100%,
也試過用 absolute 和 relative 都是不出現滾動條。
#main 的 position 是 relative,
如果 #main 設定成 absolute 後,
在 IE,FF,Opera 中會消失。

如果 td 用 px 來定位就沒有出現相容性問題,
不過頁面高度會定死了,
就無法做到我想要的效果,
頁面的高度跟隨瀏覽器的像數而變化。

下圖是排版詳情

IE, FireFox, Opera 的 #main 無法出現滾動條

Chrome, Safari 正常顯示

架構圖片

CSS



#body-div{

   width: 1200px;

   height: 100%;

   margin:0 auto;

   overflow: visible;

   position: relative;

}

#body_table tr{

   padding:0;

   margin:0;

}

#body_table{

   position: relative;

   top: 0px;

   left: 0px;

   height: 100%;

   overflow: hidden;

}

#left_td,#main_td,#right_td{

   vertical-align:top;

}

#left_td{

   background-position:35px;

   width: 200px;

   background: url(/Rs/img/v1/leftbg.jpg) righttop repeat-y;

}

#main_td{

   width: 800px;

   overflow:hidden;

   background: #FFF87A url('/Rs/IMG/v1/mainbg.jpg')left center repeat;

}

#right_td{

   width: 200px;

}

#main{

   position: relative;

   width: 800px;

   top: -1px;

   height: 100%;

   overflow: auto;

}

#header{

   background: url(/Rs/IMG/v1/header.jpg) topcenter no-repeat;

   position: relative;

   width: 800px;

   height: 170px;

   top: 0px;

   z-index: 50;

   padding-top:1px;

}

#footer{

   position: relative;

   width: 1200px;

   color: #CC4400;

   padding-top:0px;

   margin: -5px auto 0 auto;

   height: 55px;

   font-size: small;

   text-align: center;

   background-color:#00185C;

   z-index: 50;

   background:url(/Rs/img/v1/footer.png) righttop repeat-x;

}

--------------------编程问答-------------------- 这个要找专业美工来帮你了。 --------------------编程问答-------------------- IE6IE7Firefox各不相同



#example

{  

height:100px;/*Firefox*/  

_height:200px;/*IE6*/  

*+height:300px;/*IE7*/  

}  

或：  

#example

{  

height:100px;/*Firefox*/  

*height:300px;/*IE7*/  

_height:200px;/*IE6*/  

}

建议阅读：http://developer.51cto.com/art/201008/222376.htm --------------------编程问答-------------------- lz 的界面不错很震憾 --------------------编程问答--------------------

引用 2 楼 maco_wang 的回复:

IE6IE7Firefox各不相同
CSS code

#example
{
height:100px;/*Firefox*/
_height:200px;/*IE6*/
*+height:300px;/*IE7*/
}
或：
#example
{
height:100px;/*Firefox*/
*height:300px;/*IE7*/
_height……

这个好 --------------------编程问答--------------------

引用 2 楼 maco_wang 的回复:

IE6IE7Firefox各不相同
CSS code

#example
{
height:100px;/*Firefox*/
_height:200px;/*IE6*/
*+height:300px;/*IE7*/
}
或：
#example
{
height:100px;/*Firefox*/
*height:300px;/*IE7*/
_height……

可是做不到頁面高度跟隨瀏覽器的像數而變化。 ><"
無論如何~ 謝謝你唷~!!! --------------------编程问答-------------------- 页面很晃眼啊我还以为看到金子里

补充：.NET技术 ,  ASP.NET