How to make images resize automatically?

[Abby]

<style>
#Picture {position:fixed; bottom:0; z-index:100;}
</style>

<div id="Picture">
<img src="picture.png">
</div>

On smaller screens it will be too wide and make a scroll bar at the bottom, whereas on large/wide screens the image wont be wide enough. So, my question is: how do you make it compatible with all screen resolutions(without having a scroll bar on the bottom or a gap)? To have it resize properly for everyone who uses it? Sorry if I sound dumb.

[meesa]

First, your top line should be <i><style type="text/css"></i>

The answer to your question should be width:100% on your image tag.

[chrishirst]

http://unstoppablerobotninja.com/entry/fluid-images/

[Phreaddee]

so can anyone explain to me then what is wrong with this solution?

#div-that-image-sits-in img {
width:100%; 
height:auto;
}

this seems to work for me on every fluid site i've made...

surely that script within that link is just a bit of overkill yeah?