100% высота внутри 100% тд - PullRequest
Новая
       8

100% высота внутри 100% тд

1 голос
/ 23 декабря 2010

Хорошо, так вот моя проблема ... и это меня некоторое время мучает ... мне нужно установить следующую высоту DIV 100% внутри этого TD без каких-либо побочных эффектов (под этим я подразумеваю прокрутку), потому что длякакая-то неизвестная причина, когда я установил его на 100% высоты, похоже, что IE 8 делает некоторые неправильные вычисления ... Я пробовал много комбинаций, но безуспешно ... требуется переходный тип документа ... заранее спасибо за любую помощь! 

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<style>
html, body
{
    height:100%;
    margin:0px;
    padding:0px;
}
</style>
<head>
    <body>
        <table style="height:100%" border="1">
            <tr>
                <td>TOP</td>
            </tr>
            <tr style="height:100%">
                <td style="height:100%">
                    <div style="border:1px dotted blue; height:100%">CONTENT</div>
                </td>
            </tr>
        </table>
    </body>
</html>

Ответы [ 2 ]

1 голос
/ 23 декабря 2010

Граница в div является "внешней" по отношению к высоте ... Так что стиль, который вы применяете, это высота 100% + 2px (верхняя граница 1px, нижняя граница 1px) ...

Если вы удалите границу, истинная высота будет равна 100%, а полоса прокрутки должна исчезнуть :)

Как указано ниже, height:100% в нижней ячейке делает общую высоту таблицы = первойвысота ряда + 100% высоты нижнего ряда.


ОБНОВЛЕНИЕ: хорошо, это не красиво, но это лучшее, что у меня есть:

если выдолжны были дать div-идентификатору blah и использовать следующий jquery для подгонки высоты div к его родителям ... хотя для этого требуется определение высоты для первой строки / ячейки ... я установил 100pxдля примера. 

$('#blah').height($('#blah').parent().height());

jsfiddle пример ... http://jsfiddle.net/Damien_at_SF/vwcvN/

0 голосов
/ 23 декабря 2010

Вы должны взглянуть на основы моделей css box.Например: http://www.w3.org/TR/CSS21/box.html

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

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

...