Поблема с очисткой float в двухколоночном макете?

Question

[Дмитрий]

Здравствуйте. Есть такая проблема:

есть высокий сайдбар слева, и справа его обтекает контент и в контенте попадается элемент со свойством clear:left, то этот элемент окажется ниже сайдбара, что не очень нужно, особенно если сайдбар очень высокий

Эта проблема описана здесь, также описано решение, но оно НЕ работает:
Ссылка на сайт

Также есть упоминание в этой статье , но решение overflow:hidden:
Ссылка на сайт

Подскажите как вы решаете этот вопрос? Если сайдбар справа имеет фиксированную ширину а контент с флоатом и очисткой внутри слева и резиновый?

Здесь набросал примерно в чём проблема:
Ссылка на Codepen

Может есть ссылки почитать?

Answer 1

[whoisthere]

Вам нужен резиновый контент? Можно сделать без флоатов.
Решение

Comments

[Дмитрий]

в контенте будут посты с флоатом для картинки например

[whoisthere]

чистите их псевдоклассами или почитайте о свойстве flow-root -> css-live.ru/faq/displayflow-root-not-clearfix.html

[Дмитрий]

whoisthere: почистил так

.cf:before,
.cf:after {
content: " ";
display: table;
}

.cf:after {
clear: both;
}

результат тот же
Ссылка на Codepen

[whoisthere]

Дмитрий: вы пробовали в мой вариант вставить контент с флоатами и почистить псевдоклассами?

[whoisthere]

Дмитрий: https://jsfiddle.net/2xzqpe9u/3/