Firefox, IE Repeat-y horror.

Ok before i start crying please help.

Basicly i have a header, container and footer. The container holds my content and navigation. the code is as follows:

/*----Container----*/
div#container {
width:710px;
margin:2px auto;
background: url(../img/cross_bar.gif) repeat-y;
border:1px dashed pink;
}

div#container {
text-align:left;
}
/*----Container End----*/

The border is only there for me.
the cross_bar.gif is a one pixel high image.

You can see where this is going cant you :)

The problem.
IE gives me a nicley expanding and contracting green background depending on content size.
Firefox gives me a one pixel high image and refuses all attempts to repeat.

Is there an answer? Is there a workaround? or do i just resign myself to swearing at the computer until it goes away.

All answers welcomed with open arms.

Is there an answer? Is there a workaround? or do i just resign myself to swearing at the computer until it goe may be, but we need to see your complete code or a link to your page.
(Most probably with clearing your floats, see www.positioniseverything.net/easyclearing.html)