垂直重复图像边框

Question

I have looked online for a way to use an image as a border and repeat it vertically so that when the min size of a page has exceeded it will still completely fill in the border on the left and right sides but I cannot seem to find style code that works. I have got the border to display horizontally but I can use set sizes for horizontal orientation.

Is this possible? Or does anyone have a better way of accomplishing this type of effect?

Answer 1

You can use background-repeat: repeat-y; in your CSS. A working demo can be seen here.

HTML

<div id="myBG">
</div>

CSS

#myBG {
    height: 1000px;
    background-image: url('image.jpg');
    background-repeat: repeat-y;
}