Нет пробела между нижней частью div и div, внутри которого он находится

У меня есть div внутри div, и при просмотре веб-страницы в IE6 он не отображает интервал между нижней частью div class="video-tour" и нижней частью div class="content-body"

Вот как это выглядит в IE6: http://i42.tinypic.com/20zs7s7.png

Вот как это выглядит правильно в Safari: http://i44.tinypic.com/2h69de1.png

CSS для .video-tour ‹- есть несколько видео, которые разделены на разные поля, как вы увидите, они имеют ширину 31%

.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 для .content-body, внутри которого находится .video-tour

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

Любая помощь относительно того, почему в IE6 нет пробела внизу и в других браузерах, была бы полезна.


html css internet-explorer-6
person Brad    schedule 12.05.2009    source источник

Ответы (2)


arrow_upward
3
arrow_downward

Попробуйте добавить элемент div внизу после видеотура со стилем clear: Both.

person Zack Marrapese    schedule 12.05.2009

arrow_upward
1
arrow_downward

Я считаю, что это потому, что вам нужно очистить поплавки.

Вы можете попробовать разместить

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

Вокруг весь контент с видео-тура.

person janhartmann    schedule 12.05.2009
comment
Это лучшее решение, ИМО (если вы не устанавливаете явную высоту). - person DisgruntledGoat; 12.05.2009