tiling image from top

cant position element form top

[santapaws]

trying to obtain a colored side nav that stretches the page height.

body {background-image: url(../folder/color.gif); background-repeat: repeat-y; background-position: 0px 500px;}

The idea is that the image tiles from 500px down the page (0px from left). However the image tiles from the top thus extending above the required start position. I dont see whats wrong with the above code?

[Major_Payne]

body {
background: url(../folder/color.gif) repeat-y 0 500px scroll;
}

That will tile from the very top of page since you are using it on the body tag. The "0" is number of pixels from the left of page.

The first value is the horizontal position and the second value is the vertical. The top left corner is 0 0. Units can be pixels (0px 0px) or any other CSS units. If you only specify one value, the other value will be 50%. You can mix % and positions.

I would use a div for the sidebar and make it the width and height you want and use the background image there. Then you can use margin-top: XXpx; to move the div down into position.