Imaginea de background nu se repeta in pagina

[Popescu Marian]

Salut,

Am o problema cu imaginea care nu se repeta in background-ul div-ului "pagina" care contine sidebarul stanga, contentul si sidebarul stanga. In IE se vede ok dar in restul nu. As vrea sa se repete si sa aibe inaltimea cat elementul cu cea mai mare inaltime (sidebar stanga, continut sau sidebar dreapta). Am atasat o diagrama si un screenshot cu problema.
Div-ul "pagina-top" contine un slice cu imaginea de sus.
Div-ul "pagina" ar trebui sa repete pe verticala un slice din imagine. O repeta daca pun height 100% la div-ul "pagina" dar o repeta doar cat e rezolutia ecranului.
Div-ul "pagina-bottom" contine un slice cu imaginea de jos.
Structura html este:

<div id="container">
<div id="header">
	<div id="title"></div>
	<div id="meniu-sus"></div>
</div>
<div id="pagina-top"></div>
<div id="pagina">
        <div id="sidebar-stanga">
	    SIDEBAR STANGA
	</div>
        <div id="continut">
              CONTINUT
        </div>
        <div id="sidebar-dreapta">
              SIDEBAR DREAPTA
        </div>
</div>
<div id="pagina-bottom"></div>
<div id="footer">
	FOOTER
</div>
</div>

Iar CSS-ul este:

* {	margin:auto 0;padding: 0; }
body
{
	background-color:#bfbfbf;
	text-align: center;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size:13px;
}

div#container
{
	margin-left: auto;
	margin-right: auto;
	width: 1000px;
	text-align: left;
	background-color:#D5DBB5;
}
#header
{
	background-color:#b2ca0a;
	width:1000px;
	height:120px;
}
#pagina-top {
	font-size: 0;
	height:15px;
	width:1000px;
	background-image: url('../images/top-pagina.jpg');
	background-repeat: no-repeat;
}
#pagina {
	width:1000px;
	background-image: url('../images/pagina-bg.jpg');
	background-repeat: repeat-y;
}
#sidebar-stanga {
	background-color:#9E9E9E;
	float:left;
	width:305px;
	margin-left:10px;
	text-align:center;
}
#continut {
	background-color:#aEaEaE;
	width:50%;
	float:left;
	margin-left:20px;
}
#sidebar-dreapta {
	background-color:#9E9E9E;
	float:right;
	width:125px;
	margin-right:15px;
}
#pagina-bottom {
	height:15px;
	width:1000px;
	background-image: url('../images/pagina-bottom.jpg');
	background-repeat: no-repeat;	
}

#footer {
	clear:both;
	color:#ffffff;
	background-color:#222222;
	width:1000px;
	height:100px;
	margin-bottom:10px;
}

[Butcher]

Daca faci debugging la css, sa zicem pui un "border:1px solid red" la div-ul cu id-ul #pagina o sa vezi ca ai pe firefox inaltime 0 .

Da-i un float:left la div-ul cu #pagina.

[Popescu Marian]

Ai dreptate, multumesc mult Butcher.

[andrei_r]

Sau si mai bine (daca ai avea contentul centrat atunci ar fi stricat de float left) poti sa pui overflow: hidden; pe #pagina.