# Solved: html+ background+css



## timothye (Nov 19, 2004)

HI . 
i am trying to achieve a gradient background that repeats its self , im not sure what the technique is called so ill post a picture of what i am trying to do here ..
see pic
http://img219.imageshack.us/my.php?image=backgroundhv0.jpg

on the left side you see i have a black to white gradient starting from the body / content area and going out to the edge of the browser , i want this to be exactly the same on the otherside as well . 
the file i have now is
2000px X 10px 
and i have a bit of code i am using here .

[Code[
background-image:url(images/background.png);
background-repeat:repeat-y;
[/code]

anyone ahve an idea how to create this effect .this is my first time trying this and i cannot get it to work correctly .

Cheers T



> I'm looking to have a gradient background able to span the length of the page with centered content. Expectations include gradient "fanning out" from content, so if the window resizes smaller - the far left/right portions of the gradient can be cut down, but the opposite ends (from the content)


this is exactly what i am tryign to achieve


----------



## tomdkat (May 6, 2006)

Are you looking for something like the attached screenshot?

Peace...


----------



## timothye (Nov 19, 2004)

Solved ..

i have a body area ( white ) in the html which is 800px wide ..
so i made a background image 2000px X 10px 
lined it up so i would have 2 gradients , 1 on the left and 1 on right with the center of the image 800px ( white )

so it loks like this <----gradient ----| white 800px |----gradient----> remember this is 2000px wide and 10px high ..

then in the css . 
background-image:url ( images/bg.png) repeat-y;
background-position:center;

once i centered the image it works how i wanted it to ..

hope this helps someone else trying to achieve this effect !!

Cheers T


----------



## tomdkat (May 6, 2006)

Ok, then what I did wasn't what you wanted since you wanted the same "direction" of gradient on both sides of the centered content, right? What I created had the gradient in opposite directions on either side of the content. By "direction" I mean as the gradient goes from dark to light , either from left to right or right to left.

Glad you got it worked out! 

Peace...


----------



## timothye (Nov 19, 2004)

your pic is exactly what i wanted ..
but i figured it out ..

read my last post again ..

Cheers T


----------



## tomdkat (May 6, 2006)

So, the gradient image you created went from light to dark to light again?

Peace...


----------

