Туплю в HTML с высотами таблиц....

stm7884696

Народ, туплю не подеццки...
Есть три основных таблицы: Верхняя (шапка) с высотой в 200px, нажняя (футер) с высотой в 200px и средняя, которая должна растягиваться так, что бы высота всей страницы была заполнена...
В средней таблице есть два столбца в которых еще по таблице. причем левая таблица занимает по высоте столько, сколько необходимо для контента. А правая таблица может быть по высоте как больше, так и меньше левой.
Что нужно: Нужно сделать так, что если правая поддтаблица по высоте меньше чем левая, то она бы растягивалась на всю высоту левой.
Дополнительно: Пишу под HTML 4.01 Transitional, в стилях высота html & body - 100%
Вариант решения: Если указать жестко высоту средней таблицы, то тогда правай подтаблица растягиваеться до этого значения. Если указать высоту средней подтаблицы в процентах, то при смене разрешений экрана обламываеться подгон по высоте всей страницы и появляються полосы прокрутки. Если поставить 100% - высота таблицы становиться равна высоте страницы и верхняя и нижняя таблицы не учитываются

(
Как сделать так, что бы по высоте было все нормально? Никуда не уезжало и везде растягивалось?
Код средней таблицы:
[code<body>
<table cellpadding="0" cellspacing="0" border="1" height=10%>
<tr>
<td>
<table cellpadding="0" cellspacing="0" border="1">
<tr>
<td><img alt="ЛИЦА" src="images/face.jpg" height="36" width="231" class="forum"></td>
</tr>
<tr>
<td><img alt="Сергей" src="media/face01.jpg" height="120" width="100" class="face_s">
Антон Городецкий. В детстве бухал не по детски.
</td>
</tr>
<tr>
<td><img alt="" src="images/razd_footer.jpg" height="8" width="231" class="forum"></td>
</tr>
<tr>
<td><img alt="АНОНС" src="images/anons.jpg" height="36" width="231" class="forum"></td>
</tr>
<tr>
<td>
Антон Городецкий. В детстве бухал не по детски.
</td>
</tr>
<tr>
<td><img alt="" src="images/razd_footer.jpg" height="8" width="231" class="forum"></td>
</tr>
<tr>
<td><img alt="ВАШ ГОЛОС" src="images/golos.jpg" height="34" width="231" class="forum"></td>
</tr>
<tr>
<td>
Антон Городецкий. В детстве бухал не по детски.
</td>
</tr>
<tr>
<td><img alt="" src="images/razd_footer.jpg" height="8" width="231" class="forum"></td>
</tr>
</table>
</td>
<td height=100%>
<table cellpadding="0" cellspacing="0" border="1" height=100%>
<tr>
<td><img alt="" src="images/right_top.jpg" height="7" width="525" class="forum"></td>
</tr>
<tr>
<td>основной контент</td>
</tr>
<tr>
<td><img alt="" src="images/right_bottom.jpg" height="7" width="525" class="forum"></td>
</tr>
</table>
</td>
</tr>
</table>

stm7884696

Я так понял, никто не знает ?

okunek

Всех походу ломает

stm7884696

ну хоть подсказать направление, отличное от "ниже пояса"?

artimon

http://kean.nightmail.ru/

artimon

Без таблиц, но прикрутиьт туда второй столбец я не пытался.

stm7884696

Спасибо

)
это уже кое что

dedwowan

Не используя скрипты кроссбраузерно в данной структуре - никак
Можно найти обходной путь - например в твоем случае вот так




<html>

<head>

	<title>Пример</title>

</head>

<style>

	html,body {

		height:100%

	}

</style>

<body topmargin="0" leftmargin="0" rightmargin="0" bottommargin="0">

<table height="100%" cellpadding="0" cellspacing="0" border="1">

<tr>

	<td valign="top">

		<div>шапка</div>

		<div>

		

			<table cellpadding="0" cellspacing="0" border="1" height=10%>

				<tr>

					<td rowspan="2">

						<table cellpadding="0" cellspacing="0" border="1">

						<tr>

						<td><img alt="ЛИЦА" src="images/face.jpg" height="36" width="231" class="forum"></td>

						</tr>

						<tr>

						<td><img alt="Сергей" src="media/face01.jpg" height="120" width="100" class="face_s">

						Антон Городецкий. В детстве бухал не по детски.

						</td>

						</tr>

						<tr>

						<td><img alt="" src="images/razd_footer.jpg" height="8" width="231" class="forum"></td>

						</tr>

						<tr>

						<td><img alt="АНОНС" src="images/anons.jpg" height="36" width="231" class="forum"></td>

						</tr>

						<tr>

						<td>

						Антон Городецкий. В детстве бухал не по детски.

						</td>

						</tr>

						<tr>

						<td><img alt="" src="images/razd_footer.jpg" height="8" width="231" class="forum"></td>

						</tr>

						<tr>

						<td><img alt="ВАШ ГОЛОС" src="images/golos.jpg" height="34" width="231" class="forum"></td>

						</tr>

						<tr>

						<td>

						Антон Городецкий. В детстве бухал не по детски.

						</td>

						</tr>

						<tr>

						<td><img alt="" src="images/razd_footer.jpg" height="8" width="231" class="forum"></td>

						</tr>

						</table>

					</td>

					<td valign="top">

						<table cellpadding="0" cellspacing="0" border="1">

						<tr>

						<td><img alt="123" src="images/right_top.jpg" height="17" width="525" class="forum"></td>

						</tr>

						<tr>

						<td>основной контент</td>

						</tr>

						</table>

					</td>

				</tr>

				<tr>

					<td valign="bottom">		

						<img alt="321" src="images/right_bottom.jpg" height="17" width="525" class="forum"></td>

					</td>

				</tr>

			</table> 

		

		</div>

	</td>

</tr>

<tr>

	<td valign="bottom">

		<div>подвал</div>

	</td>

</tr>

</table>

</body>

</html>

stm7884696

Философ, ты лучший

mysha

а в одной таблице принципиально не хочется все сверстать?

stm7884696

нет, не хочется...
кстати, кто знает, как влияет на отображение загруженой части страницы: а)если много тоблац одна за другой, загрузилась половина, половина подгружаеться. б) если обна тадлица и загрузилаь только половина ее, остальное догружаеться.
ИМХО - в случае А загруженые таблицы будут отображаться, а в случае Б - будет ожидаться загрузка всей таблицы

artimon

В случае Б) можно поставить сss-свойство table-layout: fixed. В современных браузерах всё будет отображатся по мере загрузки.

dedwowan

За исключением оперы в браузерах любая таблица будет отображена только после полной загрузки всего кода находящегося между <table></table>
соотв. в случае А будут показаны все полностью загруженные таблицы, в случае Б показываться ничего не будет.

stm7884696

Вот об этом я и думал...
когда делал три таблицы... Типа шапка уже будет висеть, а контент подгрузиться...
Конечно, это для оччееень мееедленных модемщиков будет заметно, но все равно пытаюсь писать с оптимизацией сразу....

dedwowan

Лучше подумай вот о этом http://www.w3.org/TR/html4/struct/tables.html#h-11.2.3
в частности вот о этих словах

Table rows may be grouped into a table head, table foot, and one or more table body sections, using the THEAD, TFOOT and TBODY elements, respectively. This division enables user agents to support scrolling of table bodies independently of the table head and foot. When long tables are printed, the table head and foot information may be repeated on each page that contains table data.

и попробуй вот такой вот код заюзать в мозиле.




<table border="1" width="500" style="height:90%">

<thead>

	<tr>

		<th>1</th>

		<th>2</th>

		<th width="16"><img src="" width="16"></th>

	</tr>

</thead>

<tbody style="height:100%;overflow: auto">

<tr>

		<td>3</td>

		<td>4</td>

	</tr>

	<tr>

		<td>3</td>

		<td>4</td>

	</tr>

	<tr>

		<td>3qqqqqqqqqqqqqqq</td>

		<td>4</td>

	</tr>

	<tr>

		<td>3</td>

		<td>4</td>

	</tr>

	<tr>

		<td>3</td>

		<td>4</td>

	</tr>

	<tr>

		<td>3</td>

		<td>4</td>

	</tr>

	<tr>

		<td>3</td>

		<td>4</td>

	</tr>

	<tr>

		<td>3</td>

		<td>4</td>

	</tr>

	<tr>

		<td>3</td>

		<td>4</td>

	</tr>

	<tr>

		<td>3</td>

		<td>4</td>

	</tr>

	<tr>

		<td>3</td>

		<td>4</td>

	</tr>

	<tr>

		<td>3</td>

		<td>4</td>

	</tr>

	<tr>

		<td>3</td>

		<td>4</td>

	</tr>

	<tr>

		<td>3</td>

		<td>4</td>

	</tr>

	<tr>

		<td>3qqqqqqqqqqqqqqqqqqqqqqqqq</td>

		<td>4</td>

	</tr>

	<tr>

		<td>3</td>

		<td>4</td>

	</tr>

	<tr>

		<td>3</td>

		<td>4</td>

	</tr>

	<tr>

		<td>3</td>

		<td>4</td>

	</tr>

	<tr>

		<td>3</td>

		<td>4</td>

	</tr>

	<tr>

		<td>3</td>

		<td>4</td>

	</tr>

	<tr>

		<td>3</td>

		<td>4</td>

	</tr>

	<tr>

		<td>3</td>

		<td>4</td>

	</tr>

	<tr>

		<td>3</td>

		<td>4</td>

	</tr>

	<tr>

		<td>3</td>

		<td>4</td>

	</tr>

	<tr>

		<td>3</td>

		<td>4</td>

	</tr>

	<tr>

		<td>3</td>

		<td>4</td>

	</tr>

	<tr>

		<td>3qqqqqqqqqqqqqqqqqqqqqqq</td>

		<td>4</td>

	</tr>

	<tr>

		<td>3</td>

		<td>4</td>

	</tr>

	<tr>

		<td>3</td>

		<td>4</td>

	</tr>

	<tr>

		<td>3</td>

		<td>4</td>

	</tr>

	<tr>

		<td>3</td>

		<td>4</td>

	</tr>

	<tr>

		<td>3</td>

		<td>4</td>

	</tr>

	<tr>

		<td>3</td>

		<td>4</td>

	</tr>

	<tr>

		<td>3</td>

		<td>4</td>

	</tr>

	<tr>

		<td>3</td>

		<td>4</td>

	</tr>

	<tr>

		<td>3</td>

		<td>4</td>

	</tr>

	<tr>

		<td>3</td>

		<td>4</td>

	</tr>

	<tr>

		<td>3</td>

		<td>4</td>

	</tr>

	<tr>

		<td>3qqqqqqqqqqqqqqqqq</td>

		<td>4</td>

	</tr>

	<tr>

		<td>3</td>

		<td>4</td>

	</tr>

	<tr>

		<td>3</td>

		<td>4</td>

	</tr>

	<tr>

		<td>3</td>

		<td>4</td>

	</tr>

	<tr>

		<td>3</td>

		<td>4</td>

	</tr>

	<tr>

		<td>3</td>

		<td>4</td>

	</tr>

	<tr>

		<td>3</td>

		<td>4</td>

	</tr>

	<tr>

		<td>3</td>

		<td>4</td>

	</tr>

	<tr>

		<td>3</td>

		<td>4</td>

	</tr>

	<tr>

		<td>3</td>

		<td>4</td>

	</tr>

	<tr>

		<td>3</td>

		<td>4</td>

	</tr>

	<tr>

		<td>3</td>

		<td>4</td>

	</tr>

	<tr>

		<td>3qqqqqqqqqqqqqqqqq</td>

		<td>4</td>

	</tr>

	<tr>

		<td>3</td>

		<td>4</td>

	</tr>

	<tr>

		<td>3</td>

		<td>4</td>

	</tr>

	<tr>

		<td>3</td>

		<td>4</td>

	</tr>

	<tr>

		<td>3</td>

		<td>4</td>

	</tr>

	<tr>

		<td>3</td>

		<td>4</td>

	</tr>

	<tr>

		<td>3</td>

		<td>4</td>

	</tr>

	<tr>

		<td>3</td>

		<td>4</td>

	</tr>

	<tr>

		<td>3</td>

		<td>4</td>

	</tr>

	<tr>

		<td>3</td>

		<td>4</td>

	</tr>

</tbody>

</table>

И после этого подумай, что будет годика эдак через 3

stm7884696

xt то я не понял, что из этого следует.. .Просветите, кто уразумел ?
И что будет через 3 годика ?

dedwowan

В общем там говорится, что эти три элемента (thead, tbody и tfooter) нужны для логической группировки строк и может использоваться, например, для скроллирования только одной из этих частей.
В Мозиле это уже реализовано. В ИЕ и Опере нет. ИМХО, скоро все новые браузеры будут данную фичу поддерживать, а годика через 3 основная масса народа на эти браузеры переползет. В результате ты сможешь так отформатировать страницу, что скроллится будет только контентая часть. Сейчас в той же Опере этого сделать нельзя, в ИЕ можно добится с потерей кроссбраузерности.
По-моему это лучше, чем закладываться на людей с очень плохой связью.

stm7884696

в смысле закладываться?
+ надло писать не под идеал, а под юзабилити...
т.е. под то, что работает....

dedwowan

Сегодня не работает, завтра работает. А система остается )
И юзабилити это немножко другое.

stm7884696

да ладно, не в этом дело... Главное, что бы сейчас работало, и потом работало...
и что бы переносимость была с наименьшими затратами..
Я лично так понял.

Оставить комментарий