Problème code css pour image survollées

bonjour a tous, voilà j'ai un code css pour afficher des images en survolants des mots placés dans div
le problème et que quand je passe d'un mot à un l'autre les images qui apparaissent se décalent dans le même sens que la disposition des différent mot à survoler, je voudrai que toute les images s'affiche nt au même endroit (peu importe ou je ferai ses réglages là moi même) mais toujours au même endroit

voici le code fait pour l'exemple

a.viewpic {
position:relative;color:#ffffff;
text-decoration: none;
}
a:hover.viewpic {
text-decoration: none;
background: none;
}
a.viewpic span {display: none;}

a:hover.viewpic span {
position: absolute;
display: block;
top: -400px;
left: 0px;
z-index: 20px;
width:100%;
padding:2px 4px;
}


<div style="position:absolute; left:97px; top:486px; width:611px; height:59px;">
<a class="viewpic" href="#">image1<span><img src="image1.jpg" alt="" /></span></a>
<a class="viewpic" href="#">image2<span><img src="image2.jpg" alt="" /></span></a>
<a class="viewpic" href="#">image3<span><img src="image3.jpg" alt="" /></span></a>
<a class="viewpic" href="#">image4<span><img src="image4.jpg" alt="" /></span></a>
</div>

si quel qu'un à la soluce, je suis preneur

merci d'avance pour vos réponses

Bonjour et bienvenue parmi nous I.M.A.G.E.S

En tant que modérateur, je me dois de te faire remarquer que tu n'as malheureusement pas respecté l'une des Règles de base du forum qui est d'afficher les codes et exemples proprement à l'aide des boutons [ code]... ici ton code HTML, CSS, PHP, etc.[ /code] (sans espace).

Je te remercie par avance de bien vouloir éditer ton message afin de le rendre conforme à cette règle.



D'ailleurs, je rappelle que le lien qui apparaît en bandeau tout en haut du forum ("Nouveau sur le forum ?...") est important. Il contient des pistes de recherche, des indications sur les règles de vie de la communauté, etc.
Il serait courtois de ta part de bien vouloir en prendre connaissance.

Je t'invite également à venir te présenter à la communauté qui t'accueille avec grand plaisir

Cdt,
Sylvain

Bonjour et bienvenue sur ce forum,

Pour commencer, je te rappelle une consigne du forum que tu as dû survoler en t'inscrivant: les blocs de code dans les messages doivent être mis en forme à l'aide des balises [ code] et [ /code] (sans espace après le crochet ouvrant). Pourrais-tu corriger ton message ci-dessus, à l'aide du bouton «Éditer»? Merci d'avance.

I.M.A.G.E.S a écrit :
j'ai un code css pour afficher des images en survolants des mots placés dans div

Ce genre d'effet ne devrait pas être bidouillé en CSS, mais réalisé à l'aide de JavaScript.
Si tu ne connais pas JavaScript... eh bien, c'est le moment d'apprendre.