Помогите сконструировать при помощи div - Веб-программирование

Форум · 29.05.2006, 19:34

Код:

<body style="margin: 0;">
<div style="background: red; width: 700px; height: 300px; top: 50px; left: 150px; position: relative;"></div>
<div style="background: blue; width: 700px; height: 500px; left: 150px; position: relative;"></div>
<div style="background: yellow; width: 450px; height: 600px; left: 400px; top: 200px; position: absolute;"></div>
<div style="background: green; width: 700px; height: 60px; left: 150px; position: relative;"></div>
</body>

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

Naked · 29.05.2006, 19:49

а попробуй между желтым и зеленым вставить простой див определенной высоты - тогда должно получится...

Форум · 29.05.2006, 20:02

Цитата:

Сообщение от Naked

а попробуй между желтым и зеленым вставить простой див определенной высоты - тогда должно получится...

не получается, мне кажется надо что-то с position придумывать

Naked · 29.05.2006, 20:09

Цитата:

Форум:
не получается, мне кажется надо что-то с position придумывать

можешь привести пример кода, когда все это рушится?

Форум · 29.05.2006, 20:13

Код:

<body style="margin: 0;">
<div style="background: red; width: 700px; height: 300px; top: 50px; left: 150px; position: relative;"></div>
<div style="background: blue; width: 700px; height: 500px; left: 150px; position: relative;"></div>
<div style="background: yellow; width: 450px; height: 600px; left: 400px; top: 200px; position: absolute;"><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p></div>
<div style="background: green; width: 700px; height: 60px; left: 150px; position: relative;"></div>
</body>

Вотрезультат налицо

Форум · 30.05.2006, 00:24

Код:

<body style="margin: 0;">
<div style="background: red; width: 700px; height: 300px; top: 50px; left: 150px; position: relative;"></div>
<div style="background: blue; width: 700px; left: 150px; position: relative;">
<div style="background: yellow; width: 450px;  left: 250px; margin: -50px 0 0 0; position: relative;"><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p></div>
</div>
<div style="background: green; width: 700px; height: 60px; left: 150px; position: relative;"></div>
</div>

Вот то, что я хотел изначально. Все гениальное просто, удалите эту тему к чертям собачим, позориться не хочется.

29.05.2006, 19:34	# 1
Форум Junior Member Регистрация: 05.04.2005 Сообщения: 91	Помогите сконструировать при помощи div Код: <body style="margin: 0;"> <div style="background: red; width: 700px; height: 300px; top: 50px; left: 150px; position: relative;"></div> <div style="background: blue; width: 700px; height: 500px; left: 150px; position: relative;"></div> <div style="background: yellow; width: 450px; height: 600px; left: 400px; top: 200px; position: absolute;"></div> <div style="background: green; width: 700px; height: 60px; left: 150px; position: relative;"></div> </body> Посмотрите результат, вот такой должна быть структура предполагаемого сайта. Но проблема в том, что желтый блок нужен для текста, а если его много, то этот блок не будет подстраиваться под высоту данную текстом. Вопрос, как бы сделать, чтобы желтый блог находился на этой исходной позиции, но мог изменяться в высоту, а синий блок растягивался, подстраиваясь под конец жолтого, зеленый же передвигался вниз под синим. __________________ ...смысл должен быть понятен...

29.05.2006, 19:49	# 2
Naked ::VIP:: Регистрация: 15.05.2005 Адрес: Питер Сообщения: 1 194	а попробуй между желтым и зеленым вставить простой див определенной высоты - тогда должно получится... __________________ Чтобы воля стала действующим началом, тело должно быть совершенным.