IE7 float right bug - обычные решения не работают

Question

Я вне разочарования. Я искал ответ на этот вопрос в течение нескольких часов, но безрезультатно. Да, я знаю, что здесь уже обсуждается это: IE7 float right заставляет родительский элемент занимать всю ширину

но это, похоже, не решает мою проблему. (

У меня есть 2 поплавка (слева и справа) в правом плавающем элементе. Конечно, в любом браузере это работает, кроме IE7. Родительский плавающий справа элемент растягивается на полную ширину, а не оборачивается вокруг двух плавающих элементов внутри.

Я пробовал увеличить масштаб: 1 на родительском элементе. Я пробовал display: inline-block на родительский элемент. Я пробовал min-width: 1px на родительском элементе.

Ни одна из которых не работает! Я пробовал их в целом, а также по отдельности и до сих пор без изменений в IE7. Что я делаю не так ???

<div class="parentfloat">
    <div class="leftblock">
        LEFT FLOAT 
    </div>
    <div class="rightblock">
        RIGHT FLOAT            
    </div>
</div>

.parentfloat {
    float: right;
    display: inline-block;
    zoom: 1;
    min-width: 1px;}

.leftblock {
    float: left; 
    text-align: left; 
    margin-right: 60px;
    padding: 0;}

.rightblock {
    float: right; 
    text-align: right; 
    padding: 0;}

Answer 1

Не устанавливая явную ширину для элемента, содержащего .parentfloat, он по умолчанию (в IE7) расширяется и занимает 100% ширины. Исправление для этого - определение явной ширины для вашего .parentfloat класса.

См. jsfiddle для примера (я добавил цвета фона для ясности).

EDIT: Учитывая, что это ошибка, специфичная для IE7, я бы рекомендовал применять фиксированную ширину к IE7 только с помощью условной таблицы стилей, хака CSS или условного класса .