...">
Geek asks and answers

Css sets div height when using float

I have an area divlike this:

<div class="con">
    <div class="container"></div>
    <div class="sidebar"></div>
</div>

And CSS:

.con{
    width:100%;     
}
.con .container{
    width:70%;
    min-height:500px;
    float:left;
    background:#f00;

}
.con .sidebar{
    width:30%;
    min-height:500px;
    float:right;
    background:#ccc;

}

Class heights containerand sidebarare dynamic. When one of these class heights increases, the class conmust also increase. But my problem is class conheight is always 0, I cannot show a class of constatic height.

+5
source share
5 answers

Add overflow: auto;to .con:

.con {
    width: 100%; 
    overflow: auto;    
}
+6
source

use class clear

<div class="con">
    <div class="container"></div>
    <div class="sidebar"></div>
    <div class="clear"></div>
</div>

.clear
{
   clear:both;
}
+1
source

, , .con , . overflow: hidden .con. , <br style="clear: both;"> .

0

.con{
    width:auto; 
    overflow: auto;
    margin:0 auto;    
}
0

..

.con{display: table;}
0

More articles:


All Articles