http://jsfiddle.net/sMMHW/
In the fiddle above I have a small little red 1 pixel line that I want to repeat on the y of the inner block but its not repeating. I have my background set to
开发者_开发问答.innerbox{
height:100px;
background: url(http://www.artaholic.com/html/jsfiddle/img/grid-sprite.png) repeat-y -56px 0;
}
It is repeating, however your image is greater than 100 pixels tall so you can't see the red line repeat. You can see this by increasing the height to 500 pixels or something. The red line will show up every few hundred pixels.
To correct this make the red line in your image the full height of the image.
jsFiddle of what I'm talking about.
Problem
It's caused because the line is not the full size of the image. Which causes the image to repeat, but all of the image repeats, and not just the line.
Solution
Make a new image which will be the line and the line alone. You can even use Data URIs to save the requests.
Good luck :)
精彩评论