Background stops repeating-y once scrolling

Hi there,

My backgrounds stop repeating-y once I scroll.
[size=8pt]#container-tv { /Page container with a background/
width:100%;
background-image: url(images/back.jpg);
background-repeat: repeat;
min-height:100%;
}
#container-body-background { /Content container with a background/
margin:0 auto;
width: 1260px;
background-image:url(images/middle-back.png);
background-repeat: repeat-y;
min-height:100%;
bottom:0;
}
#container-body { /Main content container with no background/
margin-top:25px;
padding-top:50px;
float: left;
width: 1260px;
}[/size]

How do I make it stretch all the way to the bottom in both #container-tv and #container-body-background?

Ended up getting it working by setting display:table; on each one I wanted to stretch down.
[size=8pt]#container-tv {
display:table;
width:100%;
background-image: url(images/back.jpg);
background-repeat: repeat;
min-height:100%;
}
#container-body-background {
display:table;
margin:0 auto;
background-image:url(images/middle-back.png);
background-repeat: repeat-y;

}
#content {
margin-top:25px;
padding-top:50px;
float: left;
width: 1260px;
}[/size]

Although #container-body-background { only stretches to the #content

Sponsor our Newsletter | Privacy Policy | Terms of Service