Вид для печати
Народ, кто-нибудь знает, как с CSS растянуть DIV на height: 100%?
Т.е. у меня сетка сайта состоит из трех вертикальных полосок, у каждой свой background. И нужно чтобы не зависимо от заполнения (текста и картиноки т.д.) в каждой, они имели высоту во весь экран.
Даже вопрос и не такой совсем.
Код-то вот такой получается.
У меня видимо проблема в чем-то другом.Код:<div style="height:100%; width:33%; float:left; background-color:#e2e2c8"></div>
<div style="height:100%; width:33%; float:left; background-color:#f4f4ea"></div>
<div style="height:100%; width:34%; float:left; background-color:#e2e2c8"></div>
Только, админы, пост не стирайте, я разберусь выложу полную версию.
Вот я написал то, на что должно быть похоже.
Только хочется избавиться от таблиц и максимально использовать CSS и div'выКод:<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ru" lang="ru">
<HEAD><TITLE>Таблица</TITLE>
<META http-equiv=Content-Type content="text/html; charset=windows-1251"></META>
<style type="text/css">
<!--
/*
#WindowWidth { height: 1px; width: expression('100%'); }
#MinWidth {
****width: expression((document.getElementById('WindowWidth') && document.getElementById('WindowWidth').clientWidth <= 970) ? '970px' : '100%'); *
****}
*/
body { padding:0; margin:0; }
-->
</style>
</HEAD>
<BODY>
<div id="MinWidth">
<table width="100%" height="100%" cellspacing="0" cellpadding="0" border="1">
<tr height="168">
****<td height="168">
*<table width="100%" height="168" cellspacing="0" cellpadding="0" border="0">
*<tr><td>
*****top / height="168"
*</td></tr>
*</Table>
****</td>
</tr>
<tr><td>
****<table width="100%" height="100%" cellspacing="0" cellpadding="0" border="0">
****<tr>****
*<td bgcolor="#e2e2c8">middle 1 / height="100%"</td>
*<td bgcolor="#f4f4ea">middle 2 / height="100%"</td>
*<td bgcolor="#e2e2c8">middle 3 / height="100%"</td>
****</tr>
****</table>
</td></tr>
<tr height="80">
****<td height="80">
*<table width="100%" height="80" cellspacing="0" cellpadding="0" border="0">
*<tr><td>
*****bottom / height="80"
*</td></tr>
*</Table>
****</td>
</tr>
</Table>
</div>
<div id="WindowWidth"><spacer height="1" type="block"></spacer></div>
</body>
</html>
Вторая проблема, которая не работает и тут, посмотрите на закоментаринные строчки в стиле:
#WindowWidth
#MinWidth
они дают горизонтальную полосу прокрутки при 970px и не сужают страницу меньше этого значения. Но они портят всю картину. Попробуйте их разкоментировать.
Т.е. у меня не получается div'ами раздвинуть блок middle по высоте. Нужен совет.
без всяких такблиц просто пишешь height: 100%;
и убери doctype
"ТАДАМ!!!" ? [Only registered and activated users can see links. Click Here To Register...]
Меня этот вопрос тоже заинтересовал, только я так и не понял, как это реализовать. Я делаю так:
<div align="center" style="height:100%">какой-то текст тут идет</div>
Но этот слой не становится столбиком во всю страницу. Подскажите, как это правильно сделать.
Но этот слой не становится столбиком во всю страницу Подскажите, как это правильно сделать.[/quote]Цитата:
Originally posted by Veles@Mar 2 2006, 20:55
[b]Меня этот вопрос тоже заинтересовал, только я так и не понял, как это реализовать. Я делаю так:
<div align="center"* style="height:100%">какой-то текст тут идет
А если подробнее? Что означает столбиком на всю страницу? Приведите полный код…
Цитата:
Originally posted by Veles@Mar 2 2006, 20:55
Меня этот вопрос тоже заинтересовал, только я так и не понял, как это реализовать. Я делаю так:
<div align="center"* style="height:100%">какой-то текст тут идет
Но этот слой не становится столбиком во всю страницу. Подскажите, как это правильно сделать.
<div align='right'>[Only registered and activated users can see links. Click Here To Register...]</div>[/quote]
[Only registered and activated users can see links. Click Here To Register...]
удачи!