Как я могу сделать контейнер «сжатым» в IE7, когда я плаваю дочерние элементы как слева, так и справа?

Question

Вот пример проблемы: http://jsfiddle.net/ryfvn/

В IE7 контейнер становится во всю ширину и теряет свою термоусадочную пленку. Этого не происходит, если оба ребенка плавают влево или если оба они плавают вправо.

Answer 1

У меня была та же проблема, и я не мог найти ответ, используя право с плавающей точкой, но я смог получить тот же эффект, используя абсолютное позиционирование .

http://jsfiddle.net/johntrepreneur/QSr6K/2/

<div class="container">
    <div class="left">content</div>
    <div class="right">content</div>
</div>

<style type="text/css">
    .container {
            float: left;
            padding: 10px 50px 10px 10px;
            background-color: green;
            position:relative;
    }

    .left {
            float: left;
            background-color: red;
    }

    .right {
            background-color: blue;
            position: absolute;
            right: 10px;
            top: 10px;
    }
</style>

Answer 2

Добавьте ширину к вашему .container элементу.