Вот есть сайтик :
http://denden.odessalife.com/
кто-то может подсказать, как растнуть DIV? чтобы бакграунд и тени по бокам доходили до низа, и менялись динамически в зависимости от размера странички ?
|
Вот есть сайтик :
http://denden.odessalife.com/
кто-то может подсказать, как растнуть DIV? чтобы бакграунд и тени по бокам доходили до низа, и менялись динамически в зависимости от размера странички ?
ничего не понял..
<div style="width: 100%; height: 100%; align: top; position: fixed;"></div>
это?
активная подрывная деятельность способствует здоровому сну
если было бы все так просто
Как растнуть пустой DIV по высоте,
В общем, есть сайт вот такой вот верстки :
красное и зеленое поле - тени у сайта, синее - содержимое, хочется чтобы бакграунд у содержимого тянулся всегда до конца окна броузера, а красный и зеленый блок тянулись до уровня синего блока.
вроде все просто, но почему-то на указанном сайте это не выполняется, только если жестко задать все блокам высоту в пикселях.
Последний раз редактировалось oleg_; 29.12.2009 в 15:35.
Вы код м стили этой конструкции покажите для начала.
А вложенный div если ему задать проценты может не тянуться потому, что браузер не знает относительно чего ему эти проценты считать.
Проверьте чтобы у родителей этого div была высота определена.
<div class="red">
<div class="green">
<div class="blue">
TEXT
</div>
</div>
</div>
.red
{
width: 90%;
float: top;
margin-top: 100px;
background: #FF0000;
}
.green
{
width: 70%;
margin-top: 50px;
margin-bottom: 50px;
margin-left: 30%;
background: #00FF00;
}
.blue
{
width: 40%;
margin-top: 25px;
margin-bottom: 25px;
margin-left: 25px;
background: #0000FF;
}
не проверял, но мне кажется, должно работать.
активная подрывная деятельность способствует здоровому сну
первым делом не забудьте
html, body {
height: 100%;
width: 100%;
margin: 0;
padding: 0;
}
Давай не будем обманывать друг друга! Ты (да, ты) все равно останешься им!
Придётся попрощаться с тегом <!DOCTYPE>. Тогда можно растянуть слой до низа страницы. Центрировать по вертикали слой всё равно не сможет, зато с этим прекрасно справляются таблицы
___________
HTML
-------------
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<style type="text/css">
body {padding:0; margin:0; font:12pt "Lucida Console", Arial, sans-serif; color:#fff;}
td {text-align:center; vertical-align:middle;}
h1 {margin:0;}
.testTbl, .testDiv {width:100%; height:100%; background:#00f; text-align:center; vertical-align:middle;}
</style>
</head>
<body>
<!--div class="testDiv"><h1>test</h1></div-->
<table cellspacing="0" class="testTbl">
<tr>
<td><h1>НЛО прилетело и опубликовало эту надпись здесь</h1></td>
</tr>
</table>
</html>
___________
На моем сайте есть видео уроки по дивам и не толька www.v a s a v a.ru
Тут есть принцип, что div (если не указанно его height) будет тянутся при встрече с margin блочного дочернего элемента или собственного padding (которое встретило внутри себя блочный элемент ) но при условии что оба блочных элемента(в данной ситуации div) имеют одинаковые значения float(none|right|left) ... иначе будет "месево" на странице а в IE ваще чудеса
а по по воду <!DOCTYPE> то можно поставить и 4 html и вроде будет валидно
Последний раз редактировалось Namare; 13.01.2010 в 13:33.
Социальные закладки