Как минимизировать высоту строки?

K
На сайте с 12.07.2006
Offline
295
Kpd
683

Есть таблица с rowspan и colspan

<table border=1>

<tr>
<td>AAA</td>
<td>BBB</td>
<td rowspan=2>CCC</td>
</tr>
<tr>
<td colspan=2>DDD</td>
</tr>
</table>

Высота не фиксированная, в зависимости от контента. Больше всего контента в колонке ССС, она как бы определяет общую высоту таблицы.

Как минимизировать высоту первой строки (ячеек ААА и BBB)?

В Опере высота этих ячеек ставится по высоте контента, вся оставшаяся высота уходит во вторую строку с ячейкой DDD. А в остальных браузерах наоборот - первая строка (с ААА и BBB) отъедает всю высоту, а для второй строки остается высота по высоте контента DDD.

Мне нужно сделать так, чтобы во всех браузерах было как в Опере - первая строка по ывсоте контента, а всё остальное уходит во вторую строку. Т.е. минимизировать высоту первой строки.

S1
На сайте с 05.08.2011
Offline
77
#1

Покажи на изображении как ты хочешь это видеть?

То есть каждая колонка будет по высоте отдельной?

Отличный хостинг. Круглосуточная поддержка. Лучшая цена. Автоматический перенос сайтов. (https://beget.com/p18974)
K
На сайте с 12.07.2006
Offline
295
Kpd
#2

На первой картинке - как выглядит в Опере.

На второй - в Хроме.

Мне нужно чтобы во всех браузерах было как в Опере.

<table border=1>

<tr valign="top">
<td>AAAAAA AAAAAA AAAAAA AAAAAA AAAAAA AAAAAA AAAAAA AAAAAA AAAAAA AAAAAA AAAAAA AAAAAA AAAAAA AAAAAA AAAAAA AAAAAA AAAAAA AAAAAA AAAAAA AAAAAA AAAAAA AAAAAA AAAAAA AAAAAA AAAAAA </td>
<td>BBB BBB BBB BBB BBB BBB BBB BBB BBB BBB BBB BBB BBB BBB BBB BBB BBB BBB BBB BBB BBB BBB BBB BBB BBB BBB BBB BBB BBB BBB</td>
<td width="20%" rowspan=2>CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC </td>
</tr>
<tr valign="top">
<td colspan=2>DDD DDD DDD DDD DDD DDD DDD DDD DDD DDD DDD DDD DDD DDD</td>
</tr>
</table>
jpg 1.jpg
jpg 2.jpg
K
На сайте с 12.07.2006
Offline
295
Kpd
#3

Высота контента для ААА и BBB может быть любой, поэтому зафиксировать их в пикселях не получается.

K
На сайте с 12.07.2006
Offline
295
Kpd
#4

Добавил для первой строчки height=100 (высота контента всегда больше 100 пикселей), получил что хотел во всех браузерах, кроме IE 11.

P
На сайте с 05.03.2009
Offline
45
#5

Kpd,

Вот пересобрал таблицу

Сделал две ячейки в таблице и в них у же по новой таблице


<table border=1>
<tr valign="top">
<td width="80%">
<table border=1>
<tr height="100px" valign="top">
<td>AAAAAA AAAAAA AAAAAA AAAAAA AAAAAA AAAAAA AAAAAA AAAAAA AAAAAA AAAAAA AAAAAA AAAAAA AAAAAA AAAAAA AAAAAA AAAAAA AAAAAA AAAAAA AAAAAA AAAAAA AAAAAA AAAAAA AAAAAA AAAAAA AAAAAA </td>
<td>BBB BBB BBB BBB BBB BBB BBB BBB BBB BBB BBB BBB BBB BBB BBB BBB BBB BBB BBB BBB BBB BBB BBB BBB BBB BBB BBB BBB BBB BBB</td>
</tr>
<tr valign="top">
<td colspan=2>DDD DDD DDD DDD DDD DDD DDD DDD DDD DDD DDD DDD DDD DDD</td>
</tr>
</table>
</td>
<td width="20%">
<table border=1>
<tr valign="top">
<td>CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC </td>
</tr>
</table>
</td>
</tr>
</table>

У меня отображается так как надо

Видимо IE не хотел выставлять высоту строке в 100px из за третей ячейки.

Делаю сайты любой сложности с 2004 года. Качественно, ответственно, честно.

Авторизуйтесь или зарегистрируйтесь, чтобы оставить комментарий