Question

Some more detail: I’ve got two divs, one float:left, the other float:right, and the parent is clear:both so that I can order the container parents downwards on the page. Specific CSS is here:

#content {
    margin-left:auto;
    margin-right:auto;
    width: 750px;
    margin-top:50px;
    position:relative;
}
.container-div {
    padding-top:7px;
    padding-bottom:10px;
    clear:both;
    background-color:#b0c4de;
}
.left-side {
    float:left;
}
.right-side
    float:right;
}

The problem is that the background-color of the parent only covers a tiny bit on the top of the container, and chrome inspector shows that the content is apparently only that portion. What gives? How do I make the div see the float’ed divs as content?

Answer 1

Try adding overflow: auto on the parent