i want my div to be of 100% height
HTML & CSS codes
HTML
<div>
<div class="content-box news-box" style="float: right">news section</div>
<div class="content-box slider-box" style="height: 150px;">slider box</div>
<div class="content-box plan-box">plan box</div>
<div class="clr"></div>
</div>
CSS
.content-box{
background-color: #d54515;
border-radius: 2px;
}
.news-box{
width: 19.5%;
height: 100%;
}
.slider-box{
width: 79%;
}
.plan-box{
width: 79%;
margin-top: 20px;
}
Add position:absolute; right:0
to .news-box
and position:relative to parent div
Remove floats
.wrapper{
border:solid green 1px;
position:relative
}
.content-box{
background-color: #d54515;
border-radius: 2px;
height: height: 100%;
}
.news-box{
width: 19.5%;
height: 100%;
position:absolute;
right:0
}
.slider-box{
width: 79%;
}
.plan-box{
width: 79%;
margin-top: 20px;
}