Question

I can’t seem to figure out how to vertically repeat a background image on a <div>
here’s my code.

http://jsfiddle.net/pedenski/Sw6wB/

what im trying to accomplish here is to put a shadow effect on the side of the page. similar with the http://www.adobe.com/ website. you’d see a shadow border on both sides.

Answer 1

You just have no height for your left and right divs.

See this updated JS fiddle.

I’ve added height:100px; just to show that it works

div#right {
    background-image:url(http://i45.tinypic.com/ejv8uq.png);
    background-repeat: repeat-y;
    width:100px;
    height:100px;
    float:right;
}

and here is a fix for left block(background-position:top right; and height):

div#left {
    background-image:url(http://i47.tinypic.com/2hsc187.png);
    width:100px;
    height:100px;
    float:left;
    background-repeat: repeat-y;
    background-position:top right;
}