Блог

Главная - Вопросы по программированию - Нижний div в td, нулевое поле

Нижний div в td, нулевое поле

#css #html #html-table

#css #HTML #html-таблица

Вопрос:

 <!DOCTYPE html>
<html>
<head>
    <title>MyTitle</title>
    <style type="text/css">
        body
        {
            background-image:url('images/my.png');
            /*width:100%;*/
            height:100%;
            background-repeat:no-repeat;
            background-size:100%;
            /*background-position:0,0,0,0px;
            background-position:center;*/
            margin: 0;
            padding: 0;
        }
        html
        {
            height: 100%;
        }
    </style>
</head>
<body>
    <table cellpadding="0" cellspacing="0"
        style="height:100%; width: 100%; border-collapse: collapse; background-color: Red; border-color:Yellow;">
        <tr style="background-color: Green;">
            <td style="background-color: Blue; text-align: center; vertical-align: bottom; padding-bottom:0px;">
                <div style="margin: 0px 0px 0px 0px; background-color:Silver;">
                    <button type="submit">Some text</button>
                    <p style="">Another text</p>
                </div>
            </td>
        </tr>
    </table>
</body>
</html>

FF4. Окно синего цвета, это означает, что td заполняет все окно. Div имеет нулевые поля, td имеет нулевые отступы. Тем не менее, между разделом и нижним краем окна есть синий прямоугольник. Как этого избежать? Margin-bottom: -16px; не подходит.

Спасибо.

Комментарии:

1. Как насчет публикации URL, чтобы мы могли видеть проблему. Спасибо!

2. Добро пожаловать: sybicit.com/index2.htm Спасибо, что заинтересовались моей проблемой.

Ответ №1:

Проблема в p элементе — конкретно в его margin-bottom .

Причина, по которой это происходит, — сжатие полей:

Вы можете исправить это в данном случае с помощью overflow: hidden on div , который является родительским для p .

Ваш код:http://jsbin.com/enote5

Ваш код с исправлением: http://jsbin.com/enote5/2

(или вы могли бы просто удалить margin на p , если хотите)