Javascript 我怎样做div'；s高度保持100%至；“主要”；集装箱？ 这里有新闻提要 这里有另一条新闻

假设我有一个容器“main”，我有两列。两列均为

float：左

当人们点击左侧新闻提要栏上的“加载更多”时，当然会扩大该栏的高度，因为我们加载了更多的内容。但我希望右边的列也能用它展开。换句话说，我希望“右”列始终是main的100%高度

我该怎么做？我是否将“右”列的高度设置为100%？或者什么？
如果你想改变div的高度，那么

<div id="main">
    <div id="left">
        news feed goes here
    </div>
    <div id="right">
        another news feed ges here
    </div>
    <div style="clear:both;"></div>
</div>

document.getElementById（“yourRightDivsId”）.style.height=yourNewHeight；
复制与否。。这里有一把小提琴，让你知道如何做到这一点


HTML

jQuery

.left {
    background:#666;
    margin:10px;
    width:130px;
    height:80px;
    float:left;
    padding:10px;
}
.full {
    width:130px;
    background:#eee;
    float:right;
    height:80px;
    padding:10px;
    margin:10px;
}
.main {
    width:500px;
    background:#000;
    height:140px;
    margin:20px 10px;
}
.more{
border:#000 1px solid;
    padding:3px;
    background:#222;
    color:#aaa;
    margin:20px;
    cursor:pointer;
}

$（'.more'）。单击（函数（）{
$（'.main'）.append（'这是一个左框'）；
$（'.full'）.css（'height'，'+=120px'）；
$（'.main'）.css（'height'，'+=120px'）；
});
实现这一点的方法多种多样，问题与css一样古老。请看一些来自中国的回报。
<span class="more">load more</span>
<div class="main">
    <div class="left">this is a left box</div>
    <div class="full">this is the right box</div>

</div>

.left {
    background:#666;
    margin:10px;
    width:130px;
    height:80px;
    float:left;
    padding:10px;
}
.full {
    width:130px;
    background:#eee;
    float:right;
    height:80px;
    padding:10px;
    margin:10px;
}
.main {
    width:500px;
    background:#000;
    height:140px;
    margin:20px 10px;
}
.more{
border:#000 1px solid;
    padding:3px;
    background:#222;
    color:#aaa;
    margin:20px;
    cursor:pointer;
}

$('.more').click(function(){
   $('.main').append('<div class="left">this is a left box</div>');
   $('.full').css('height', '+=120px'); 
   $('.main').css('height', '+=120px'); 
});