CSS Clearing float

Question

Я работаю с двумя слоями поплавков, и попытка очистить их, похоже, не работает должным образом.

Вот эта страница: http://cloud -catering.com / new / about.php

Скрипка: http://jsfiddle.net/MLS1984/twrXh/

СкрипкаХотя проблема не отображается должным образом, поэтому сайт является лучшим справочным материалом для этой проблемы.Я не уверен, почему, когда я использую:

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

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

Answer 1

Попробуйте расширить левое меню до конца страницы. Или поместите поле слева от изображений. См. Мой комментарий выше для объяснения.

Answer 2

Я бы посоветовал вам использовать трюк с очисткой.

Без использования clear: both | left | right это заставит контейнер очищать его дочерние элементы, что делает его идеальным для использования в ситуации, когда может быть плавающее содержимое справа и слева и средний контейнер с плавающими элементами ... .

http://nicolasgallagher.com/micro-clearfix-hack/

Это намного лучше, чем использовать дополнительные теги для очистки контейнеров / плавающих элементов, если вы просто хотите разместить их на родительской странице ....

Answer 3

Попробуйте использовать: после псевдокласса очистить поплавки легче

.myDiv:after { content:''; display:block; clear:both; }