css怎么使一个div的高随另一个div的高的变化而变化，还有就是怎么使第三个div的位置随它们的高度而变化。
感觉有点没说清。大家可以参见3w.smosz.cn/mosco/(3w变www)。有一个大div，里面有左右下三个div,左边的div的高度随内容的变化而变化（已实现），现在要右边的div的高随左边的变化而变化，同时下面的div的位置在上面div的高度变化后也自动往下变。试了好多方法了，都不行啊！难点：本站已有布局，不能打破原布局。位置的那一个好像要div全是position:static就可以了，但是因美观所以position只能是absolute。当然所谓的美观就是网站现在的样子，如果有其它方法可以实现的也是可以的。求帮助。解决了再加30分。
再帮忙看一下吧。
最常用的办法是：把你<div id="Layer7"></div>的背景颜色改成与此div的父级div的背景颜色一样，这样一来，<div id="Layer7"></div>跟父级div的颜色融为一体，就算<div id="Layer7"></div>高度固定，也看不出其高度会不会变化。这是大部分使用边侧菜单的网页常用的方法。要这么做，你的HTML代码只需要加上一个div，其它不变，修改如下：
<div id="Layercontent"> /* 加上这个div，把6 7 8 9 10div 包起来 */<div id="Layer6"></div>
<div id="Layer7">
<div id="Layer8"></div>
<div id="Layer9"></div>
</div>
<div id="Layer10"></div>
</div> /* 加上这个div，把6 7 8 9 10div 包起来 */
CSS代码其他不变，只用以下代码清单更换你相应部分：
#Layercontent {position:absolute;
margin-top:152px;
margin-left:21px;
width:858px;
background-color: #cccccc; /* 设置大背景颜色 */
}
#Layer6 {
float: left;
border-right: 1px solid rgb(120, 120, 120);
width:615px;
height:auto!important;
_height:625px;
min-height:625px;
z-index:7;
background-color: #cccccc;
}
#Layer7 {
float: right;
height:auto!important;
_height:625px;
min-height:625px;
width:234px;
z-index:7;
background-color: #cccccc; /* 设置此div背景颜色与大背景颜色一样 */
}
#Layer10 {
float: left;
margin-top: 1.5em;
width:858px;
height:88px;
text-align: center;
line-height:44px;
background-color: #cccccc;
}
颜色都可以修改，只需保证#Layer7与#Layercontent背景颜色一样，这样看起来#Layer7就像自动增加高度。
左边，也用auto;右边用100%就可以了，
比如左边的auto会随内容高而高，然后外面容器层也会随着左边，或者右边高而高，，，
那么，右边的100%，就是相对于容器的高度，所以。就OK了。。。。
举个粟子：
<style>
#box{height:auto;width:640px;margin:0 auto;}
#box .left{width:50%;height:auto;float:left;}
#box .right{width:50%;height:100%;float:left}
<div id="box">
<div class="left">在边的层高度会随着左边的高度。。。</div>
<div class="right"></div>
</div>追问
这个不行吧，我的bodydiv里除了有左右外还有下面的div。当然可以举一反三把100%改百分80等，但是因为bodydiv的高度是变的，所以具体的数据是不能保证左右相等的，当然也可以再加一个层，但是觉得再加一个太麻烦，我前面的布局都要变了，可能会出现新的问题。还有另一个问题，就是下面层的位置怎么设啊？
追答没看到人代码，什么都不好说。
不知道有没有理解错你意思，，，，最好有代码
css文件可以下载的。你可以去到我提供的网址去看一下。我那不是个论坛吗，左边是内容，内容的多少由用户决定，所以高度是变化的，为了美观，所以右边的层的高度要随左边的变化，同理，下面的版权信息也要下移。贴一些代码吧。代码太多了，贴到补充里去。
追答以我的代码来说
可以把版权信息放到box下面
#box{height:auto;width:640px;margin:0 auto;}
#box .left{width:50%;height:auto;float:left;}
#box .right{width:50%;height:100%;float:left}
#footer{width:640px;margin:0 auto;}
在边的层高度会随着左边的高度。。。
也可以这样：
#box{height:auto;width:640px;margin:0 auto;}
#box .left{width:50%;height:auto;float:left;}
#box .right{width:50%;height:100%;float:left}
#box .footer{width:100%;height:100px}
.cle{clear:both;}
在边的层高度会随着左边的高度。。。
这样布局肯定是可以做到你那样的，至于你的页面就要看你其它的布局，以及其它样式的定义。
在4个div外面加上一个div，设置为居中，高度为100%，宽度你自己用你觉得合适的值，overflow-y设置为auto；
然后对你原本存在的最上面的那个div设置float为top，宽度设置为100%，高度设置你自己觉得合适的值；
然后原本存在的左边div，高度设置auto，设置float为left，宽度比例你自己设置合适的值；
右边的div高度你可以用一点js和jquery来控制，比如你用$("#divLeft").css("height")来获取左边的高度，然后把这个值设给右边就可以实现实时变化了，因为我知道你这个forum的话是左边可能变化比较大，然后右边要随着左边的变化来适应，当然float也要设置为left；
（此处要保证你的左div和右div的宽度之和刚好是最外层的div的宽度）
最下面的div也设置宽度100%，float设置为bottom或者left随便，高度你自己挑合适的值就好了。
关键在于float和获取更改css值。
补充一下，position能不用尽量别用absolute
<!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 type="text/css">
.outer,.inner{
width:200px;
}
.outer {
margin:10px 0;
background:red;
color:#fff;
display:table;
}
.inner{
float:right;
margin-left:200px;
background:blue;
}
.right{
float:right;width:180px;
}
.left
{
float:left;width:180px;
margin-left:-200px;
}
</style>
</head>
<body>
<div class="outer">
<div class="inner">
<div class="right">
如果这边高于另一边,那另一边也会自适应这边的高度
</div>
<div class="left">
低
</div></div>
</div>
<div class="outer">
<div class="inner">
<div class="right">
低
</div>
<div class="left">
如果这边高于另一边,那另一边也会自适应这边的高度
</div></div>
</div>
</body>
</html>
css怎么使一个div的高随另一个div的高的变化而变化,还有就是怎么使第...
最常用的办法是：把你<div id="Layer7"><\/div>的背景颜色改成与此div的父级div的背景颜色一样，这样一来，<div id="Layer7"><\/div>跟父级div的颜色融为一体，就算<div id="Layer7"><\/div>高度固定，也看不出其高度会不会变化。这是大部分使用边侧菜单的网页常用的方法。要这么做，你的...
css怎么使一个div的高随另一个div的高的变化而变化,还有就是怎么使第...
右边的div高度你可以用一点js和jquery来控制，比如你用$("#divLeft").css("height")来获取左边的高度，然后把这个值设给右边就可以实现实时变化了，因为我知道你这个forum的话是左边可能变化比较大，然后右边要随着左边的变化来适应，当然float也要设置为left；（此处要保证你的左div和右div的宽度之和...
怎么才能让左边的div的高度随着右边div的高度变变化而变化,用css写
<style type="text\/css"> <\/style> <\/head> <body> <div id="div1" style="width:300;height:auto;border-style: solid;float:left;padding:5"> <div id="div2" style="width:100;float:left;border-style: solid;"> 左边~~~<\/div> <div id="div3" style="width:180;height:aut...
div设置高度自适应?
示例代码如下：CSS代码第一种写法 html,body{height:100%;margin:0;}\/**把HTML和BODY的高度设置成100%**\/ div{height:100%;background-color:#ccc;}\/**把你DIV的高度设置成100%**\/ CSS代码第二种写法 div{height:100%;position:absolute;width:100%;background-color:#ccc;left:0;top:0;}...
如何用jq或js控制一个div的高度随着另一个div的高度的变化而变化
最简单的实现方式：仅提供一个思路。可以自己完善。<body><input type="button" id="btn" value="变大" \/><div style="width:100px; height:100px; border:1px solid #ccc; float:left;" id="div1"><\/div> <div id="div2"><\/div><\/body><script>var oBtn = document.getElement...
DIV的高度随着内容的增加而增加
1、如果父div不定义height、子div均为标准流的时候，父div的height随内容的变化而变化,实现父div高度随子div的高度改变而改变。代码：<style type="text\/css"> aa{ border:#000000 solid 5px} bb{border:#00ffff solid 5px;} cc{ border:#0033CC solid 5px} <\/style> <div id="aa">父div...
如何让一个DIV浮动在另一个DIV上面
1、首先，创建两个div，如下图所示，然后进入下一步。2、其次，完成上述步骤后，需要给其Class属性，如下图所示，然后进入下一步。3、接着，完成上述步骤后，使用CSS通过Class属性为其设置样式，如下图所示，然后进入下一步。4、然后，完成上述步骤后，需要给其一个宽度和高度，再加上边框，如下图...
css怎样才能设置高度为100%,就是里面的div跟着外面的大div增高。
<li><\/li> <li><\/li> <li><\/li> <li><\/li> ...无限 <\/ul> <\/div> 如果出现div的高度不随li的增加而增高的话，把代码改成如下：<div> <lu> <li><\/li> <li><\/li> <li><\/li> <li><\/li> <li><\/li> <\/ul> <div style="clear:both"><\/div> <\/div> ...
怎么让父div(相对)的高度跟随子div(绝对)的高度变化?
非必要布局的话，你还是别用相对和绝对布局，既然你这里并没设定位移，那就没必要加position:absolute;绝对定位；况且我也想不到有什么布局需要父级加了position:relative;后还需要跟随子级高度变化，通常这样布局貌似很少用，父级一般也就用来做定位 ...
css中如何实现左边的高度随着右边改变而改变
<div class="right"><\/div> <\/div> 那么可以这样定义css:.container {width:960px; height:100%; overflow:hidden; margin:0 auto;} .left {height:100%; width:200px; overflow:hidden; padding-bottom:9999px; margin-bottom:-9999px; float:left; display:inline;} .right {width:750px;...
