背景图像不在列上重复

Question

右手边的背景图片出现问题。我预计它会在主要内容区域高度发生变化时垂直重复。

任何帮助，将不胜感激

这里是我的CSS

#rightcol { 
     background: #86030b url(images/leftcol-bg.jpg) top repeat-y; 
     height:100% !important; 
     text-align: center; 
     float: right; 
     width: 210px; 
     padding: 20px auto; 
     } 

Here is some more of my CSS 

    #content-wrapper { 
width: 930px; 
height: 100%; 
margin: 10px auto; 
} 

#content_main { 
height: 100%; 
padding: 14px; 
top: 0px; 
background: #fff; 
width: 692px; 
float: left; 
margin-bottom: 0px; 
} 

#rightcol { 
background: #86030b url(images/leftcol-bg.jpg) top repeat-y; 
height:100% !important; 
text-align: center; 
float: right; 
width: 210px; 
padding: 0px auto; 
    } 

感谢您的帮助迄今为止

Answer 1

所有的父元素，包括身体标记，需要有高度的100％设置为让您的“rightcol”填充页面的整个高度。

这里是一个小轻读，这可能有助于http://webdesign.about.com/od/csstutorials/f/set-css-height-100-percent.htm

Answer 2

试试这个：

#rightcol { 
    background-image:url('images/leftcol-bg.jpg'); 
    background-repeat:repeat-y; 
    height:100% !important; 
    text-align: center; 
    float: right; 
    width: 210px; 
    padding: 20px auto; 
    } 

Answer 3

你需要把你的主要内容和右列都在div是包装了，并把背景在那个div上。