原文:
http://tansy.blogbus.com/logs/4987207.htmlDemo:
http://files.blogbus.com/tansy.blogbus.com/files/1176084661.htm
Code
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>两列高度自适应浏览器</title>
<style>
html {
margin: 0;
overflow: hidden;
height: 100%;
padding: 0 !important;
padding: 110px 0 15px 0;
}
body {
margin: 0px;
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
background-color: #333333;
height: 100%;
padding: 0 !important;
padding: 110px 0 15px 0;
}
#top {
height: 110px;
top: 0px !important;
top: -220px;
position: absolute!important;
position: relative;
background-color:#CC9999;
width: 100%;
}
#main_left {
background: white;
position: absolute!important;
position: relative;
top:110px!important;
top:-220px;
height:auto!important;
height:100%;
width:184px;
float:left;
background-color: #FFFFFF;
padding: 0 0 0 6px;
bottom: 14px!important;
bottom: 0;
overflow: auto;
left: 4px;
}
#main_right {
position: absolute!important;
position: relative;
top:110px!important;
top:-220px;
height:auto!important;
height:100%;
background-color: #fff;
overflow: auto;
bottom: 14px!important;
bottom: 0;
left: 197px !important;
left: 4px;
right: 4px;
margin: 0 !important;
margin: 0 8px 0 0;
}
#main_bottom {
height: 15px;
bottom: 0 !important;
bottom: -1px;
position: absolute;
font-size: 0;
background-color: #FFCC66;
width: 100%;
}
</style>
</head>
<body>
<div id="top"></div>
<div id="main_left">
<p>12345678945678946513245687456489754321</p>
<p>12345678945678946513245687456489754321</p>
<p>12345678945678946513245687456489754321</p>
<p>12345678945678946513245687456489754321 </p>
<p>12345678945678946513245687456489754321 </p>
<p>12345678945678946513245687456489754321 </p>
<p>12345678945678946513245687456489754321 </p>
<p>12345678945678946513245687456489754321 </p>
</div>
<div id="main_right"></div>
<div id="main_bottom"></div>
</body>
</html>
浙公网安备 33010602011771号