Стол <TR>высота в мозилле - PullRequest
Новая
       4

Стол <TR>высота в мозилле

0 голосов
/ 27 февраля 2011

У меня здесь есть таблица с двумя полями, в которой высота составляет 1 пиксель, а остальные 100 процентов.Этот пример явно выглядит в Google Chrome.Но это не работает в Mozilla.Как исправить в Mozilla? 

<!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">
<head profile="http://gmpg.org/xfn/11">
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <style>
    *{margin: 0; padding: 0;}
    html, body{position: relative; width: 100%; height: 100%; overflow: hidden;}
    table{height: 100%; width: 100%; position: relative;}
</style>
</head>
<body>
    <table cellpadding="0" cellspacing="0" height="100%">
        <tbody height="100%" >
            <tr>
                <td height="100%" valign="top">
                    <div style="overflow: auto; height: 100%">
                        sdfsdf<br />sdfsdf<br />sdfsdf<br />sdfsdf<br />sdfsdf<br />sdfsdf<br />sdfsdf<br />sdfsdf<br />sdfsdf<br />sdfsdf<br />sdfsdf<br />sdfsdf<br />sdfsdf<br />sdfsdf<br />sdfsdf<br />sdfsdf<br />sdfsdf<br />sdfsdf<br />sdfsdf<br />sdfsdf<br />sdfsdf<br />sdfsdf<br />sdfsdf<br />sdfsdf<br />sdfsdf<br />sdfsdf<br />sdfsdf<br />sdfsdf<br />sdfsdf<br />sdfsdf<br />sdfsdf<br />sdfsdf<br />sdfsdf<br />sdfsdf<br />sdfsdf<br />sdfsdf<br />sdfsdf<br />sdfsdf<br />sdfsdf<br />sdfsdf<br />sdfsdf<br />sdfsdf<br />sdfsdf<br />sdfsdf<br />sdfsdf<br />sdfsdf<br />sdfsdf<br />sdfsdf<br />sdfsdf<br />sdfsdf<br />sdfsdf<br />sdfsdf<br />sdfsdf<br />sdfsdf<br />sdfsdf<br />sdfsdf<br />sdfsdf<br />a1
                        afasdasd sdfs sdv
                    </div>
                </td>
            </tr>
            <tr>
                <td height="1" valign="top">
                    test<br />test<br />test<br />test<br />test<br />
                </td>
            </tr>
        </tbody>
    </table>
</body>
</html>

Ответы [ 2 ]

1 голос
/ 03 мая 2011

Первоначально он работал для меня как в Chrome 10, так и в последней версии FF. И этот пример помог мне понять, почему «строка размера 99% или 100% высоты в таблице не может автоматически растягиваться в Chrome ». Эта ошибка обсуждалась во многих местах, но особого решения не было .. Итак, на этом рабочем примере мне удалось найти решение: все, что мне нужно было сделать, это " сделать строку высоты таблицы 99% или 100% для автоматического изменения размера в Chrome 10, это сделать высоту родительской таблицы 100% "

1 голос
/ 27 февраля 2011

Я не уверен, как движок Mozilla интерпретирует атрибут высоты HTML для тега <td>, но вы можете получить лучшие результаты, используя CSS вместо стиля. Вы пробовали что-то вроде:

В HTML ... 

<td class="shortcell">

В вашем стиле блок ... 

td.shortcell {height: 1px; vertical-align: top;}

Или встроенный ... 

<td style="height: 1px; vertical-align: top;">

ОБНОВЛЕНИЕ: атрибут высоты CSS будет работать только на элементе уровня блока, поэтому вы можете использовать: 

td.shortcell {height: 1px; vertical-align: top; display: block}

Это будет работать, но будет осуждено. Вероятно, лучше поместить DIV в ячейку таблицы и применить к ней высоту.

HTML ... 

<td>
  <div class="shortcell">
     contents here
  </div>
</td>

И CSS: 

.shortcell {height: 1px;}
...