Have Geek Brain

No free space between bottom of div and div inside

I have a div inside a div and when viewing a webpage in IE6 it does not display the distance between the bottom of the div class = "video tour" and the bottom of the div class = "content-body"

This is how it looks in IE6: http://i42.tinypic.com/20zs7s7.png

This is how it looks right in Safari: http://i44.tinypic.com/2h69de1.png

Css for .video-tour <- there are several videos which as you will see are split into different blocks, they are 31% wide

.video-tour {
    float:left;
    width:31%;
    border:1px solid #fdbe2f;
    background-color:#ffc;
    text-align:center;
    padding:3px;
    overflow:auto;
    margin:6px;
}

.video-tour img {
    border:1px solid #fdbe2f;
    padding:3px;
}

CSS for the .content-body that the .video-tour is inside

.content-body {
    padding:10px 15px;
    font-size:.8em;
    font-family:arial;
    overflow:auto;
}

Any help as to why there is no spacing at the bottom of the screen in IE6 and it would be helpful to use spacing in other browsers.

+1


a source to share


2 answers


Try adding a div at the bottom after the video tour that has a clear: both style.



+3


a source


I believe because you need to clean the floats.

You can try to post



<div style="width: 100%; overflow: hidden;"><!-- floats go here --></div>

All content is a video tour.

+1


a source






More articles:


All Articles