Как да направя лента която да се разтяга?

[boor]

Ето пример в работа.бг.Като тая горе сивата.сайта винаги си е посредата,а само лентата се разтяга до края.Мерси предварително.
http://www.rabota.bg/

 

[svilkaa]

<style>
body {
margin: 0;
}
div.lenta {
width: 100%; 
background-color: #F5F5F5; 
border-bottom: 1px solid #DADADA;
}
</style>
<div class="lenta">Линк | Линк | Линк</div>

 

[shterev]

Ами направи два div-a Единия(външния) да се разтяга ,даже направон не му слагай ширина(width), а само височина(height),ако ти е нужно.
Другия div, вътрешния да си има фиксирана ширина и да е центриран по средата.И вече вътре в него си слагай каквото искаш то ще е посредата.

HTML:
<div class="vynshen">
<div class="vytreshen">edno dve t.n.</div>
</div>


CSS:
.vynshen { background-color:#000000;}
.vytreshen { margin:0px auto; width:200px;}

п.с. задължително сложи width на вътрешния див , за да може да се центрира.На кратко е това

 

[boor]

а как мога да направя така че да се разтяга дадено изображение(пак с дивове ако може).

 

[shterev]

на дива задаваш background , и тук вече в зависимост как ще се разтяга див-а ,задаваш стойност на background-a.Но картинката ти трябва да е такава ,че при повтарянето и да не си личи.В случая не можеш да сложиш една сника и тя да се разтегне,както искаш.Изрязва се малка част и я задаваш като фон и да се повтаря.

Пример:
.fon { background:url(../images/fon4e.gif) repeat-y left top;}

tтова repeat указва как да се повтаря фона:
repeat - повтаря се по хоризонтала и вертикала,

repeat-x - повтаря се само по хризонтала

repeat-y -повтаря се само по ветикала

repeat-none - не се повтаря нито по хоризонтала нито по вертикала.


а left i top са първоначалните позиции на фона.Ако картинката е по-къса от дива , можеш да направиш така че да се появявя в ляво (както в случая ) , в дясно и центрирао(center - тук ако се разтегне дива , фона ще е винаги в средата).
Ами долу горе е нещо такова. :?:

 

[boor]

<style>
body {
margin: 0;
}
div.lenta {
width: 100%; 
background-color: #F5F5F5; 
border-bottom: 1px solid #DADADA;
}
</style>
<div class="lenta">Линк | Линк | Линк</div>

Мерси,сега си намерих темата,но имам още 1 въпрос.Как да направявя колко px да е висока лентата(наппример 50 px)?
Мерси предварително.

 

[EmPowerYou]

Променяш div.lenta, така:

div.lenta {
width: 100%;
height: 50px:
background-color: #F5F5F5;
border-bottom: 1px solid #DADADA;
}

Просто добавяш height: стойността. Ако искаш, heigh да се увеличава само, т.е. като добавяш информация лентата сама се измества до долу, но за тази цел ще ти трябва информация, която да стига до края на сайта.