Помогите растянуть сайт в длину (верстка на DIV)

Статус
В этой теме нельзя размещать новые ответы.

zaqwsx_

Знаток
Регистрация
29 Авг 2006
Сообщения
227
Реакции
29
Помогите пожалуйста, сделал сайт клиенту, я еще начинающий:


левая тень состоит из одного дива, центральная колонка из еще одного, и правая тень из еще одного дива.
Как мне заставить левую и правую тень растягиваться вместе со средней колонкой ?
Все заключил в контейнер.
если надо, вот исходник сайта :

HTML:
<body>
<div class="container0">  - общий конетйнер
<div class="boka_l">  - левая тень
</div>
<div class="container"> - средняя колонка
тут все содерживое сайта
</div>
<div class="boka_r"> - правая тень
</div>
</div>
</body>
вот CSS :

Код:
html{height:100%;}

body{                                                       -----> общие настройки для всего тела странички
margin:0px;
height:auto;
font-family: Verdana, Geneva, sans-serif;
font-size: 0.8em;
color: #FFF;
padding:0px;
background-image:url(../images/boka2.png);
background-color:#666261;
}

.container0 {         ------> общий контейнер, объединяет в себе вес сайт
width:1048px;
height: 1000px;
margin:0 auto;
overflow:hidden;
}

.boka_l {                                              --------->  левая тень
background-image:url(../images/boka_left.png);
width:49px;
height:100%;
float:left;
margin:0px;
padding:0px;
}
.boka_r {                                  ----------------> правая тень
background-image:url(../images/boka_right.png);
width:49px;
height:100%;
float:left;
}
.container {                                       ---------------------> средний контейнер
margin:0 auto;
width:950px;
height:100%;
background-image:url(../images/bg.jpg);
background-repeat: no-repeat;
z-index:0;
background-color:#666261;
float:left;
}
 
У тебя в примере классы одни, а в стилях другие...
вот простой пример, используй width в процентах
HTML:
<div style="background:#333; width:100%; height:100px;"> <!-- центральная часть -->
   <div style="background:#008000; width:20%; height:100px; float:left;"></div> <!-- левая часть зелёный -->
   <div style="background:#FF0000; width:20%; height:100px; float:right;"></div> <!-- правая часть  красный -->
</div>

Если нужно сжимать или расширять до определённого значения, то используй min-width и max-width
 
мне растянуть не в ширину, а в длину

я уже пробовал и min-height использовать

но не получается.

а, извините, указал не ту часть сайта , уже поправил в исходном сообщении.
 
И в примере написал бы полный путь до изображений, непонятно где чего смотреть... Нормально бы написал задачу, давно бы уже ответ получил )

нужно растягивать по горизонтали или по вертикали?
 
Когда-то нашел в инете рецепт - как 3 колонки делать одинаковые по высоте. Сохранил у себя на компе, выкладываю "как есть".
 
А если попробовать сделать вложенные дивы?
Надо будет поправить CSS
Код:
.boka_l 
{
background:url(../images/boka_left.png) repeat-y 0 0;
width:1048px;
}
.boka_r 
{
background:url(../images/boka_right.png) repeat-y 999px 0;
width:1048px;
}
и изменить HTML
HTML:
<body>
<div class="container0">

<div class="boka_l">
<div class="boka_r">

<div class="container">
тут все содерживое сайта
</div>

</div>
</div>

</div>
</body>
 
А так принципиально делать эту тень дивом? Возможно, проще будет положить ее фоном в эту или в соседнюю колонку?
 
Статус
В этой теме нельзя размещать новые ответы.
Назад
Сверху