Probléme de positionement d'image en html

Bonjour,
Je débute en création de site web et je bute sur une question.

J'ai une page sur laquelle j'ai mis une image de fond fixe.

Sur cette image de fond j'ai placé une autre image qui est centré et une autre placé comme ceci :


voici les codes de ces 3 éléments :

<img class="centered" src="LOGO MYLITTLESCHOOL.png" alt="logo my little school">
<IMG STYLE="position:fixed; TOP:400px; LEFT:420px; WIDTH:105px; HEIGHT:150px" SRC="grenouille petit modele.png">
<div align="center">
<object type="application/x-shockwave-flash" width="400" height="220" data="player.swf">
<param name="movie" value="player.swf" />
<param name="flashvars" value="file=movieMLS.flv" />
</object>
</div>

Le placement de la grenouille sur la page me convient parfaitement mais lorsque je réduit la fenêtre en largeur l'image de la grenouille ne reste pas fixe.
Elle se déplace vers la droite et vient passé sous le lecteur de vidéo qui est à sa droite
Comment dois-je faire pour qu'elle ne bouge plus ?

Merci

Suite du précèdent message :

En fait je vient de m'apercevoir que lorsque l'on change les paramètres et résolutions de l'affichage d'écran cad si on passe de 1440x900 pixels à
1280x720 pixels par exemple c'est la catastrophe et encore pire si je passe à 1024x768 pixels, car là l'image en question disparait totalement sous le lecteur flv et mon menu dont le code css est :
#navcontainer {
position:absolute;
left: 25%;
top: 50%;
width: 700px;
height: 400px;
margin-top: -100px; /* moitié de la hauteur */
margin-left: -300px; /* moitié de la largeur */

disparait de moitié.

Que faire ?

Suite du précèdent message :

En fait je vient de m'apercevoir que lorsque l'on change les paramètres et résolutions de l'affichage d'écran cad si on passe de 1440x900 pixels à
1280x720 pixels par exemple c'est la catastrophe et encore pire si je passe à 1024x768 pixels, car là l'image en question disparait totalement sous le lecteur flv et mon menu dont le code css est :
#navcontainer {
position:absolute;
left: 25%;
top: 50%;
width: 700px;
height: 400px;
margin-top: -100px; /* moitié de la hauteur */
margin-left: -300px; /* moitié de la largeur */

disparait de moitié.

Que faire ?