自动Div高度取决于另一个 [英] Auto Div height depend on another one

问题描述

我有以下场景我想要Div2高度调整大小取决于Div3的内容
我该怎么做？

  ---------------------------------- 
。 DIV1。 
。 --------- ------------------。 
。 。 。 。 。 。 
。 。 DIV2。 。 DIV3。 。 
。 。 。 。 。 。 
。 。 。 。 。 。 
。 --------- -----------------。 。 
 .-------------------------------- 
  

解决方案

我想要显示DIV2和DIV3的相同高度。通过CSS，您可以执行以下操作：

HTML

< < div class =wrapper>
< div class =child_1>第一个Div内容到这里< / div>
< div class =child_2>第二个Div内容到这里< / div>
< / div>


CSS

 。wrapper {
 width：960px; 
 overflow：hidden; 
 margin：0px auto; 
} 
 
 .child_1，.child_2 {
 padding-bottom：1000px; 
 margin-bottom：-1000px; 
 width：50％; 
 float：left; 
} 
 
 .child_1 {
 background：＃f00; 
} 
 
 .child_2 {
 background：＃0f0; 
} 
  

上面的代码会显示你的div高度相等，如果他们有1000px不同的高度每个代码。你可以改变1000px，如果你认为在某些情况下差异可能更多。它将在所有浏览器中支持

也许你可以使用javascript。您需要找到最长的div的高度，并在其他div中设置相同的高度。

I have the following scenario I want Div2 height to resize depend on the content of Div3 how I can do that ?

----------------------------------
.      DIV1                      .
. ---------   ------------------ .
. .       .   .                . .
. .  DIV2 .   .        DIV3    . .
. .       .   .                . .
. .       .   .                . .
. ---------   -----------------. .
.--------------------------------

解决方案

I think you want to display same height of both DIV2 and DIV3. By CSS you can do it as below:

HTML

<div class="wrapper">
    <div class="child_1">First Div content goes here</div>
    <div class="child_2">Second Div content goes here</div>
</div>

CSS

.wrapper {
        width: 960px;
        overflow: hidden;
        margin: 0px auto;
    }

    .child_1, .child_2 {
        padding-bottom: 1000px;
        margin-bottom: -1000px;
        width: 50%;
        float: left;
    }

    .child_1 {
        background: #f00;
    }

    .child_2 {
        background: #0f0;
    }

Code above will display your div height's equal if they have 1000px different in height as per code. you can change 1000px, if you think in some case difference could be more. It'll support in all browsers

Other wise you can use javascript for it. You need to find height of longest div and set same height in other div.

这篇关于自动Div高度取决于另一个的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！