Оформление первого контейнера, подскажите как решить проблему

Голоса: +1
Всем привет! Ребят, помогите пожалуйста с траблом оформления первого контейнера.

Картинку я порезать могу как угодно, но нужно допустим под мини-чат сделать ее так, чтоб она как бы растягивалась и закрывалась опять таки в целый планшет. Это реально?
Адрес сайта http://remont-r.at.ua/
| Автор: | Категория: Вопросы новичков
Получается, оформление каждого блока нужно разделить на три части (верхнюю, среднюю и нижнюю). Среднюю часть нужно сделать повторяющейся по вертикали. Но как это прописать? Помогите плиз!
Я так понимаю, здесь мне никто не поможет?! (((
Печально ((( За целый день ответ, такой же как я сама придумала :'(
Ну вопрос еще актуален! Помогите пожалуйста?

Ответов: 1

голоса: +3
 
Лучший ответ
Попробуйте разрезать картинку на три части (верх, маленькая середина, которая будет удлиняться дублированием картинки и низ)

дублирование средней части картинки достигается путем задания в css следующих стилей {background: url(background2.png) repeat-y;}

сам блок може выглядеть подобным образом

<div class="top">Заголовок</div>

<div class="center">Контент</div>

<div class="bottom"> </div>

в css

.top {background: url(top.png);}

.center {background: url(center.png) repeat-y;}

.bottom {background: url(bottom.png);}
| Автор:
Выбор ответа лучшим | | Автор: Валентина Махонина
Но у меня вид блоков сформирован вот так:

.boxTable {width:350px;}
.boxTitle {height:20px;background:url('http://remont-r.at.ua/Oformlenie/Bloki/shapka_bloka.png') no-repeat;padding-left:0px;}
.boxContent {background:url('http://remont-r.at.ua/Oformlenie/Bloki/osno1va_bloka.png') repeat-y;padding:0 50px 0px 50px}

А Сам блок выглядит так:

<!-- <block3> -->
<table border="0" cellpadding="0" cellspacing="0" class="boxTable" style="text-align: center;"><tbody><tr><td class="boxTitle"><b style="color: rgb(0, 255, 255);"><!-- <bt> --><!--<s3199>-->Мини-чат<!--</s>--><!-- </bt> --></b></td></tr><tr><td class="boxContent" style="text-align: center;"><!-- <bc> --><span style="color: rgb(0, 255, 0);">$CHAT_BOX$<!-- </bc> --></span></td></tr></tbody></table>
<!-- </block3> -->

Как его нужно изменять в этой ситуации?
Разрезайте картинку на три части (верх, середина, которая будет повторяться по-вертикали и низ) Сам блок так же разбиваете на три части top, center, bottom. В css задаете фон к этим частям. Для того, чтобы фон средней картинки дублировался по-вертикали нужно добавить repeat-y

Я могу направить вас на решение проблемы, но писать за вас полный код специально для вашего сайта и разрезать картинку, увы, я не могу. Я вам показал выше в ответе как решить пример 2х2, а вам нужно 22х22.

Если вы все равно не можете разобраться, то рекомендую вас обратиться за специализированной помощью к разработчикам на сайте http://upartner.pro/
Я поняла что мне нужно сделать, но я не могу понять, как разделить блок, где поменять код на
<div class="top">Заголовок</div>

<div class="center">Контент</div>

<div class="bottom"> </div>

(((((((
Значит не поняли, если не знаете как код поменять... Примерно так, но это примерно

<!-- <block3> -->
<div class="top"><!-- <bt> --><!--<s3199>-->Мини-чат<!--</s>--><!-- </bt> --></div>

<div class="center"><!-- <bc> -->$CHAT_BOX$<!-- </bc> --></div>

<div class="bottom"> </div>
<!-- </block3> -->
Вот теперь поняла и почти сделала. Ток картинку доработать нужно. Спасибочки Вам огромное. Я просто ток учусь работать с этим всем. А друг попросил, так вродь и по делу тренируюсь )))
...