PDA

View Full Version : div height problem



nepoverljiv
26 Mar 2011, 06:01 PM
Hi, I try to make two layer inside one layer, and one layer who will be "pull" these two to make same heights for both layers, left and right. Shortly, my code is:



<div id="main-body">
<div id="left">
left
</div> <!-- left-->

<div id="right">
right
</div> <!-- right-->

<div id="floatanchor">&nbsp;</div>

</div> <!-- main-body -->


and CSS is:



#main-body {
margin: 0 auto;
width: 987px;
height: auto;
margin-top: 0px;
}

#left{
width:683px;
float: left;
background-color: fuchsia;
height: auto;
}

#right{
width:304px;
float: right;
background-color: aqua;
height: auto;
}

#floatanchor {
width: 987px;
height: 10px;
clear: both;
background-color: blue;
}



So, how to make right layer to have same height, like left layer, in situation where in left layer have some text, and right layer is have just one word. Anyone help me?

nepoverljiv
26 Mar 2011, 06:58 PM
Solutions:

#main-body {
margin: 0 auto;
width: 987px;
height: auto;
margin-top: 0px;
overflow: hidden;
}

#left {
width:683px;
float: left;
margin-bottom: -2000px; padding-bottom: 2000px;
}

#right {
width:304px;
float: right;
margin-bottom: -2000px; padding-bottom: 2000px;
}