css ширина% в ie7

У меня есть родительский контейнер, который составляет 100%. Он содержит 2 плавающих элемента div шириной: 50%. Дети содержат только текст. Проблема в том, что дочерние элементы получают ширину текста, а не 50% ширины родительского контейнера. Проблема только в ie7. Может быть и ie6, но мне плевать на этот браузер.

ball (width 16px position absolute)
   parent (width 100% position absolute. Should be more than 16px)
      child (width:50% float left)
      child (width:50% float left)

Кто-нибудь может помочь?


person Johansrk    schedule 19.06.2010    source источник
comment
Пожалуйста, опубликуйте код HTML+CSS   -  person FelipeAls    schedule 19.06.2010


Ответы (1)


Нет необходимости в взломе JS. Просто используйте правильный тип документа.

Скопируйте и вставьте и запустите это, проверьте результат, затем удалите тип документа и повторите проверку в IE.

<!doctype html>
<html lang="en">
    <head>
        <title>Test</title>
        <style>
            body { width: 300px; }
            .parent { width: 100%; border: 1px solid black; overflow: hidden; }
            .child { float: left; width: 50%; }
            h3 { clear: left; }
        </style>
    </head>
    <body>
        <h3>Test 1</h3>
        <div class="parent">
            <div class="child">text</div>
            <div class="child">text</div>
        </div>
        <h3>Test 2</h3>
        <div class="parent">
            <div class="child">text text text text text text text text text text</div>
            <div class="child">text</div>
        </div>
        <h3>Test 3</h3>
        <div class="parent">
            <div class="child">text</div>
            <div class="child">text text text text text text text text text text</div>
        </div>
    </body>
</html>

Без типа документа или с типом документа нестандартного режима IE будет отображать в причудливый режим .

person BalusC    schedule 19.06.2010