immagine background ridimensionabile in base alla risoluzione schermo

fairydesign

immagine background ridimensionabile in base alla risoluzione schermo

Ciao a tutti,
ho realizzato un sito che ha per background una fotografia.
Questa dovrebbe adattarsi a qualsiasi risoluzione un utente utilizzi per visualizzare il mio sito.
La mia idea sarebbe di utilizzare una sola foto che poi si adatta in altezza e larghezza allo schermo.

Ho utilizzato questo metodo ma ovviamente su IE6 non funziona, cioè mi posiziona la foto non come background ma come una semplice immagine inserita nel body.

Altra cosa vorrei che l'immagine si deformasse il meno possibile, qual'è la giusta proporzione che dovrebbe avere l'immagine per adattarsi alla risoluzione video?

Questa è la pagina:
<body>
<img id="bg" src="images/sf.jpg" alt="background" />
<div id="container">
...
</div>
</body>
</html>

Questo il css
html,body{ width:100%; height:100%; margin: 0;padding:0;}

body{
margin:0 auto;
height:100%;
text-align: center;
background:#fff;
font:12px Arial, Helvetica, sans-serif;
color:#13193a;
}

#bgoriginal {
position:fixed;
width: 100%;
height: 100%;
z-index: 1;
top:0;
left:0;
}

#bg {
min-height: 100%;
min-width: 1024px;
width: 100%;
height: auto;
position: fixed;
top: 0;
left: 0;
}

Se esite un metodo più sicuro, migliore fatevi avanti!!
Saluti