Дополнительное пространство в нижней части контейнера с плавающей точкой

Question

Это текущая настройка:

<div id="youtubelatestnews">
    <div class="box youtubebox">
    </div>

    <div class="latestnews">
    </div>

    <div class="clear"></div>
</div>

Но проблема в контейнере <div>, который "youtubelatestnews" имеет слишком много места внизу.

Вот сайт: http://voila.easywebprojects.com/

<div> s, о которых я имею в виду, - это подглядывание и последние новости.

Answer 1

Причиной дополнительного пробела является чистый div, который также будет очищен под элементами слева.

Вы можете удалить clear div и использовать overflow: hidden; в div #youtubelatestnews. Поскольку для него не указана высота, стиль переполнения заставит элемент содержать только его дочерние элементы.

Answer 2

Попробуйте добавить float:left; стиль к youtubelatestnews div, у меня это сработало; -)

Answer 3

Дополнительное пространство может быть вызвано высотой очищаемого элемента по умолчанию иногда, Попробуйте добавить height:0px для очистки.

https://jsfiddle.net/8zpt7tm3/

Answer 4

Нижнее поле на .box-product > div плюс нижнее поле на .box объединяются.