<!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>DIV自适应高度</title>
</head>
<style type="text/css">
.Panel { width: 500px; border:1px solid #222; overflow:hidden; }
.Panel .Left { width:200px; background-color:red; float:left; padding-bottom:30000px; margin-bottom:-30000px;}
.Panel .Right { width:300px; background-color:blue; float:right; padding-bottom:30000px; margin-bottom:-30000px; }
</style>
<body>
<div class="Panel">
<div class="Left"></div>
<div class="Right">1<br/>2<br/></div>
</div>
</body>
</html>
Left和Right是Panel下的两个子层,Right层高度不固定。实现Left和Right层的高度一样。
用padding-bottom:30000px; margin-bottom:-30000px;把子层拉高,再父层用overflow:hidden;遮蔽
DIV自适应宽度



