...

View Full Version : resize an image



carissa
02-25-2005, 08:03 PM
I have figured out how to use div instead of tables so that my website automatically readjusts the page as the user resizes the page. I have an image as my header, though; and I can't figure out how to get it readjust too. It stays a constant size (whatever I created it as) so it is either too big or too small for the page depending on what size the user has their webpage set at. Can someone tell me if there is a way to code a picture in CSS to automatically readjust? :confused:

rmedek
02-25-2005, 10:03 PM
Sort of. If you enclose the image in a block level element that resizes (like a div), then set the dimensions of the image to percentages, it'll resize according to width. But not height, as the height of a div adjusts to its content...



CSS:

#expando {
width: 50%;
height: 25%;
}

#expando img {
width: 100%;
height: 100%;
}

HTML:

<div id="expando">
<img src="example.gif" alt="stretchy" />
</div>


Try something like that and see if it works out for you. Usually people make one large background image and try to incorporate the change in size into the design. Here's an example (http://lostbarrioartists.com).

Hope this helps,



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum