hi,

i'm trying to have my header navigation stretch and contract to the size of the browser window (like this site). I know how to do this with html, but I can't figure out how to do it with an image file (gradient). Can someone help? Thanks!

Hi Shane,

There are a couple of ways to do this. First you have to create the gradient image. For this site you can see that it is a 1 pixel wide by 91 pixel high.

Second, you need apply a style to make this sliver stretch across the width of the browser. You can do either in the body tag:

body {
background: url(../images/bodyback.gif) repeat-x;
}

or you can create a div for the top banner and do it there:

#topbanner {
background: url(../images/bodyback.gif) repeat-x;
width: 100%;
}

Hope this helps.

Peter.

Shane, just re-read your post and think I misunderstood.... do want help on how to create the gradient image?