View Full Version : Auto-resizing image

06-03-2005, 02:17 PM
Ok my question is how do you get images to auto-resize both ways? For example, the title in the following code. I see it done all the time on webpages. I can get the title to resize horizontally, but that squeezes the image together. I don't want that. I want it to resize both horizontally and vertically, so the image is not squished. I've seen it where the whole entire image resizes when your browser window resizes.

The picture is too big to upload right now, but I think you know what I'm talking about. Thanks.

"-//W3C//DTD XHTML 1.0 Strict//EN"
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang = "en" dir="ltr">

<meta http-equiv="content-type"
content="text/html; charset=iso-8859-1" />
<link rel="stylesheet" href="main.css" type="text/css" />

<div id="container">

<div id="top">
<p><img border="0" src="title.png" width="985" height="109"></p>

06-03-2005, 02:28 PM
An image wouldn't look good stretched to be honest, what you've seen is probably an image and a header with a background image which is repeated.

But to do it you'd use percentages as so...

<img border="0" src="title.png" width="90%" height="20%">

...and place the border="0" into your CSS -

img { border: none }

06-03-2005, 03:35 PM
Yeah that does screw the image up bigtime. It does what I said though...kinda. :)

I'll find a site here in a second for an example of what I am seeing. It seems like the images resize but their quality stays the same. I'll re-post as soon as a find that site. Thanks.