Высота разрыва : 100%?

Простейшая из страниц для демонстрации моей проблемы:

<!DOCTYPE html>
<html>
    <head>
        <style type="text/css">
            html, body
            {
                height: 100%;
                overflow: hidden;
            }
            body
            {
                margin: 0;
                padding: 0;
            }
            #container
            {
                background: red;
                height: 100%;
                overflow: hidden;
            }
        </style>
    </head>
    <body>
        <div id="container"></div>
    </body>
</html>

контейнер div правильно заполняет окно браузера красный. Теперь оберните div в форму:

<body>
    <form>
        <div id="container"></div>
    </form>
</body>

и div-контейнер свернется. Почему? Что такого в теге формы, который «разбивает» «ближайший предок по высоте»?

5
задан Charles 14 February 2012 в 17:05
поделиться