Image Stretching

Do you have a question? Post it now! No Registration Necessary.  Now with pictures!

Threaded View
Imagine if I had a banner graphic for going across the top of my page in a
div, but I want it to be 100% of the window, whatever the resolution (so I
would probably go for a 1024*150 banner image), ie if anyone had a 1280
display, the image would still just appear once without repeating or tiling,
or having any blank space to the right of it.

is it possible to specify 100% as an image width?

Re: Image Stretching

Quoted text here. Click to load it
You could start by removing the default padding and margin from the body

body {margin: 0; padding: 0;}

Then I would put your image in a div as the divs background and colour the
divs background a colour that complemts the image in the background of the
div. If the window resolution is very high and/or the  window is wide, then
a bit of the background colour will show - which is better than white.
Minimise this by having a background image with a very big width. Even so,
don't forget the no repeat value as this image is not supposed to tile under
any circumstances.

Site Timeline