Внутренний div превышает внешние границы div - PullRequest
Новая
       15

Внутренний div превышает внешние границы div

7 голосов
/ 03 ноября 2008

Я не могу заставить внутренний div (с Hello World) поместиться внутри div "box" в этом примере кода (также в http://www.toad -software.com / test.html ).

Несмотря на то, что тело установлено на 100%, внутренний div не будет содержаться! Это тестовый пример для более крупного проекта, в котором таблица переменной ширины выходит за границы своего контейнера. Таблица будет во внутреннем div, а контейнер - в «коробке». 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
    <style type="text/css">
        /*html { width: 100%; height: 100%; position: relative; background: #c0c0c0; }
        body { position: absolute; width: 100%; height: 100%; background: #f9f9f9; }*/

        body,
        html 
        { 
            margin: 0;
            padding: 0;
        }

        body
        {
            width: 100%;
        }

        div.box
        {
            padding: 10px;
            background: #ff33ff;
        }

    </style>
</head>
<body>
    <div class="box">
        <div style="width: 1500px; height: 900px; background: #f12;">Hello World</div>
    </div>
</body>
</html>

Ответы [ 2 ]

9 голосов
/ 03 ноября 2008

добавить overflow:hidden; в контейнер <div>

7 голосов
/ 04 ноября 2008

Ширина 100% элемента body связана с портом просмотра, поэтому при прокрутке цвет фона обрезается. Либо установите ширину вашего тела в 1520 пикселей, чтобы охватить содержащийся div, либо добавьте еще один div и выполните следующие действия: 

div.box { width: 100px; overflow: auto; }

Однако, как предупреждение, движение по пути горизонтальной прокрутки - плохая идея для первого проекта в css и в пользовательском опыте.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...