28172 sujets

CSS et mise en forme, CSS3

Bonsoir,
J'ai crée 4 zones réactives sur une photo pour avoir 4 pops up au survol
, la première fonctionne, pas la seconde.
Je n'ai rempli que 2 zones car la seconde ne fonctionne pas, d'ou ma demande. Il s'agit de la photo du groupe de droite.
Page d'essai:
http://amichant.free.fr/groupessai.htm
Merci.
Voici ton code :

<img class="groupedroit" src="images/ggroupDax.jpg" usemap="#map" border="0" height="314" width="550">
<a href="" class="bulle">
    <map name="map"><area shape="rect" coords="0,1,268,125"></map>
    <span>
        <h1>BASSES</h1>
        LAMOLIE Michel *FROUSTEY Pierre *DERYCKE Marc
        DOUET J.Paul *PUYO Alain *DEMOULIN Christophe
    </span>
</a><a href="" class="bulle">
<map name="map">
<area shape="rect" coords="271,4,544,125">
</map>


Autrement dit c'est un peu le bordel et là je l'ai un peu indenté.

En isolant ton image et en organisant un peu :
<img class="groupedroit" src="images/ggroupDax.jpg" usemap="#map" border="0" height="314" width="550">
<map name="map">
    <area shape="rect" coords="271,4,544,125" href="#">
    <area shape="rect" coords="0,1,268,125" href="#">
</map>


Aussi, en règle générale met un # quand tu ne définis pas de page pour tes liens.
Ce que tu me donnes c'est le code de départ que j'ai sorti avec Gimp quand j'ai crée mes 4 zones réactives.
Après j'ai modifié pour créer 4 pop up en CSS visibles au survol.
Donc la première fonctionne et la seconde non...
Alors comment faire pour que la seconde et les suivantes fonctionnent aussi?