css start repeating background from defined position

css background repeat
ilija veselica picture ilija veselica · Apr 9, 2011 · Viewed 24.5k times · Source 
#container{
    background:url(images/bg-main.png) repeat-y;
    width: 903px; 
    background-position: 0px 687px;
    background-position: bottom;
    height: 1200px;
    margin-left: auto;
    margin-right: auto;
    }   
#content{
    background:url(images/bg-wood.png) repeat-y;
    width: 903px; 
    height: 678px;
    margin-left: auto;
    margin-right: auto;
    }

#content div is inside #container div. I want #container's background to start repeating at 687px from top. Is it possible?

EDIT: Is it possible that first x pixels of div (from top) have emtpy space and after x pixels backgrund starts?

Answer

clairesuzy picture clairesuzy · Apr 9, 2011

As far as I know it's not possible how you're trying to do it, repeat-x and repeat-y, will repeat the image in both directions along the axis

if you repeat container background full length does the content div background image not cover up the first 678px anyway?

can you provide code in a JSFiddle so we can see what effect you're trying to achieve there will be a way ;)

Related questions

Stretch and scale a CSS image in the background - with CSS only

I want that my background image stretch and scale depending on the browser viewport size. I've seen some questions on Stack Overflow that do the job, like Stretch and scale CSS background for example. It works well, but I want …

Read More
div background color, to change onhover

I'm trying to make a div's background color change on mouse over. the div {background:white;} the div a:hover{background:grey; width:100%; display:block; text-decoration:none;} only the link inside the div gets the background color. what could I …

Read More
How to get div height to auto-adjust to background size?

How do I get a div to automatically adjust to the size of the background I set for it without setting a specific height (or min-height) for it?

Read More