Этак, не знаю что придумать!

[Stock]

В общем верстаю шаблон для cms и вот столкнулсо с проблеммой, не могу 3 части собрать в один левый блок, чтобы они зависили друг от друга, тоесть в середине будет баграунд который будет по оси "y" расмножаться, нужно чтобы одновременно с этим и нижняя часть двигалась за фоном, т.е. чтобы не имела постояной координаты, а двигалась за баграундом, вот прилагаю для понятности скрины и фрагмент кода..... Кстати с отображением тоже проблеммы в opere, я так понил что из-за абсолютного положения, с этим я уже сталкивалсо)

Этак вот код html

<div id="blockhead">
		<h3>$title</h3>
</div>
<div id="block">
	$content
</div>
<div id="blockfooter">
<img class="bfooter" src="templates/celestial/images/b2.png">
</div>

Вот CSS

.block2 {
margin: 56% 0 0 50%;
z-index:2;	
position:absolut;		
}
#blockhead {
width: 206px;
height: 162px;
background: url(images/b1.png) no-repeat;
margin: 0 0 0 23px;
}
#blockhead h3 {
margin: 8% 0 0 0;
text-align: center;
}
#block {
background: url(images/b_bg.png) repeat-y;
width: 206px;
margin: -8% 0 0 0;
z-index:8;
position:absolute;
}
#blockfooter {
margin: 396px 0 0 35px;
}

Скрин из EI 7.0

Скрин из Оперы

Надеюсь на Вашу помощь!

Edited January 14, 2009 by Stock

[Stock]

Народ, ну помогите! Верстка стоит, не могу дальше продолжать из-за этого! Ответе если не понятно обьяснил, разжую получше!

[klierik]

тяжело так сказать...

надо видеть...

[Stock]

Ну посмотри на скрины! Ввизу же ссылки на скрины оставил!

Edited January 14, 2009 by Stock

[klierik]

а что с скринов то? надо пощупать... посмотреть.. попробывать исправить "на лету"

[Stock]

Ну и как можно поступить? Ты же не будешь ставить движок ради этого, я же не буду тебе скидывать недоделанную тему и т.п.(хотя если что могу, все равно она делаеться для паблика) Может просто что-то посоветуешь, предложишь, а я пробовать буду...

Внимания, на отображения элемента не обращай внимания, я это сам могу поправить, главное подскажите как скомпоновать эти 3 элемента в 1! Чтобы они зависили друг от друга, т.е. если баграунд разитянулся под информацию, нижняя часть двигалась за ним и не образовала дырок и кривизны!

Edited January 14, 2009 by Stock

[Emm]

Создай три вложенных блока и примени к ним бэкграунд с позиционированием.

прим.

<div class="b_1">  <!-- верхний фон -->
<div class="b_2">  <!-- нижний фон -->
<div class="b_3">  <!-- фон по оси -->
контент
</div>
</div>
</div>

[Stock]

Emm,

ВОт что получилось...

ссылка на фото хостинг

Низ получился не очень, можно как то нижний элемент засунуть под баграунд, чтобы только оранжевые уголки торчали?

Вот код:

<div class="blockhead" ><h3>$title</h3> <!-- верхний элемент -->
<div class="block" >$content <!-- баграунд -->
<div class="blockfooter" > <!-- нижний элемент -->
</div>
</div>
</div>

и CSS:

.blockhead {
width: 206px;
height: 162px;
background: url(images/b1.png) no-repeat;
margin: 10% 0 0 2%;
text-align: center;
}
.blockhead h3 {
margin: 8% 0 0 0;
text-align: center;
color: #fe6302;
}
.block {
background: url(images/b_bg.png) repeat-y;
width: 206px;
margin: 10% 0 0 6%;
text-align: left;
}
.blockfooter {
width: 202px;
height: 163px;
background: url(images/b2.png) no-repeat;
}

Edited January 15, 2009 by Stock