[css]rozciagliwosc diva

[Stef@n]

Witam,
mam problem najpierw podam link do strony aby bardziej obrazowo to przedstawić http://www.kozuchykorzen.pl/test.html

1) Otóż problem polega na tym ze div#srodek (powinno być białe tło) nie rozciąga się z treścią zawartą w nim. Nie mam zielonego pojęcia jak to zrobić, pod IE nie ma problemu bo się rozciąga a pod FF nie widać.
2) Drugi problem to ramka którą chce aby div#okienko_left i div#okienko_right rozciągały się równo do dołu z div#okienko_tresc.

Proszę was bardzo o pomoc, podaje kod:

.html

Kod:

<div id="srodek">
    <div id="okienko">
        <div id="okienko_top"></div>
        <div id="okienko_left"></div>
        <div id="okienko_tresc">jakas tresc<br />fdgfgf</div>
        <div id="okienko_right"></div>
        <div id="okienko_bottom"></div>
    </div>
</div>

.css

Kod:

body {
    background-color: #702F4A; margin-top: 0px; font-family: Arial; color: #000000; font-size: 12px; line-height: 18px;
}
#srodek {
    width: 780px; margin: auto; background-color: #FFFFFF;
}
#okienko {
    width: 276px; height: 59px; display: block; float: left; padding-left: 36px;
}
#okienko_top {
    background-image: url(okienko/top.jpg); display: block; width: 276px; height: 34px; clear: both;
}
#okienko_left {
    background-image: url(okienko/left.jpg); display: block; width: 5px; float: left;
}
#okienko_tresc {
    display: block; width: 249px; float: left; background-image: url(../grafika/okienko/bg.jpg); background-color: #FFFFFF; background-repeat: no-repeat; background-position: bottom;
}
#okienko_right {
    background-image: url(okienko/right.jpg); display: block; width: 22px; float: left;
}
#okienko_bottom {
    background-image: url(okienko/bottom.jpg); display: block; width: 276px; height: 37px; clear: both;
}

Pozdrawiam

[Labsta.com]

Witam

#srodek dodaj w css

Kod:

overflow: hidden;

#okienko usuń:

Kod:

height: 59px;

Skoro box ma stałą szerokość to wyrzuć div#okienko_left i div#okienko_right. Zamiast niego daj do #okienko_tresc

Kod:

background: url(tlo_scalone.jpg) repeat-y

Gdzie tlo_scalone będzie plikiem łączącym obrazek lewego, prawaego i z białym środkiem. Wysokość jpg może być nawet 1px;

A ornament dodaj w osobnym divie.

Prościej i taniej

Mam nadzieję, że dobrze zrozumiałem.

[Stef@n]

Dzięki to pierwsze działa ok!
A co do drugiego to właśnie też tak planowałem ale w div#okienko_tresc jest jeszcze tło które ma się wyświetlać u dołu boxa ;/ i tu już się pogubiłem...

[Labsta.com]

Zrób tak:

Kod:

<div id="okienko_tresc">jakas tresc<br />fdgfgf</div>

dodaj

Kod:

<div id="okienko_tresc">jakas tresc<br />fdgfgf<div id="ornament"></div></div>

css

Kod:

#ornament {background: url(okienko/bg.jpg) no-repaet 0 0; width:249px; height: ??px;}

?? = wysokość obrazka. Tam gdzie jest 0 0 ustawiasz pozycję obrazka tła w boksie, ale pewnie dasz radę. Piszę "z ręki" więc może być jakiś błąd.

P.S.
No i jeszcze szerokość się zmieni jeśli zrobisz tak jak mówiłem na 276px.

[Stef@n]

Dzięki za pomoc... ale znalazłem inne rozwiązanie. Na zasadzie
<div id="lewa"><div id="prawa"><div id="zawartosc"></div></div></div>

Pozdrawiam