extending or stretching a background graphic

  • Thread starter Thread starter Mark
  • Start date Start date
M

Mark

I have noticed some web pages like tvguide or espn use a multi colored
background where the bottom color seems to extend toward the bottom of the
page. I was wondering how you would go about getting the graphic image to
stretch or extend for the length of your web page. If you simply use the
image without extending or stretching it it continually repeats itself on
the page. Any help would be appreciated
 
Set the body background colour to be the same as the appropriate edge of the
image, then use CSS to stop the image repeating.

<style type="text/css">
body {background: blue url(images/gradient.jpg) repeat-x;)
</style>

In this example the background image is a vertical gradient that ends with
blue at the bottom. The image need only be 10px wide, and whatever height is
required. The page background colour is set to blue, so that where the image
stops, the page background colour takes over seamlessly. The image is
allowed to repeat accross the width of the page (repeat-x), but not down the
page.
--
Ron Symonds
Microsoft MVP (Expression Web)
http://www.rxs-enterprises.org/fp

Reply only to group - emails will be deleted unread.
 
Back
Top