IdentifiantMot de passe
Loading...
Mot de passe oublié ?Je m'inscris ! (gratuit)
Navigation

Inscrivez-vous gratuitement
pour pouvoir participer, suivre les réponses en temps réel, voter pour les messages, poser vos propres questions et recevoir la newsletter

Mise en page CSS Discussion :

[CSS] lien dans un div avec superposition d'image


Sujet :

CSS

  1. #1
    Membre habitué Avatar de avogadro
    Profil pro
    Inscrit en
    Mars 2006
    Messages
    412
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Mars 2006
    Messages : 412
    Points : 188
    Points
    188
    Par défaut [CSS] lien dans un div avec superposition d'image
    Bonjour,

    j'ai donc un petit probleme : jai une premiere image définie de cette façon

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    div#map {
        background-image:  url(../images_regions/67%2068%20ALSACE.jpg);
        background-repeat: no-repeat;
        height: 600px;
        width: 403px;
    }
    Et d'autres images se metent sur celle-ci, le probleme c'est que les petites images qui doivent se mettre dessus doivent également avoir un lien, elles sont définie comme ça :

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
     
    div#armoire1 {
        background-image:  url(../images_regions/armoire.gif);
        left: 0px;
        top: 165px;
    }
     
    div#armoire1, div#armoire2, div#armoire3 {
        background-repeat: no-repeat;
        position: relative;
        height: 23;
        width: 23;
    }
    Je ne sais pas ou mettre le lien, faire de cette façon ne marche pas : <a href....><div id="armoire1"> </div></a> il y a des problèmes...

    Dans l'html ça ressemble a ça :
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    <div id="map">
     
    		<div id="armoire1"> <a href="../robots/alsace_strasbourg.htm"
     target="droite">Strasbourg</a></div>
     
    </div>
    Auriez vous une idée?
    =-=-=-=-=-=-=-=-=-=--=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-==-=-=-=-=-=-=-=-=-=-=
    (\_/)
    (O.o)
    (> <)
    This is Bunny. Copy Bunny into your signature to help him on his way to world domination!!
    =-=-=-=-=-=-=-=-=-=--=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-==-=-=-=-=-=-=-=-=-=-=

  2. #2
    Membre régulier
    Inscrit en
    Juin 2005
    Messages
    120
    Détails du profil
    Informations forums :
    Inscription : Juin 2005
    Messages : 120
    Points : 106
    Points
    106
    Par défaut Quels problèmes ?
    C'est dure de t'aider si tu nous dis pas quels sont tes problèmes !!

  3. #3
    Membre confirmé Avatar de masu
    Inscrit en
    Février 2004
    Messages
    428
    Détails du profil
    Informations forums :
    Inscription : Février 2004
    Messages : 428
    Points : 484
    Points
    484
    Par défaut
    pourquoi pas quelquechose comme ca
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    <div id="map">
    <a id="armoire1" href="../robots/alsace_strasbourg.htm"
     target="droite">Strasbourg</a>
    </div>
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    #armoire1 {
        background-image:  url(../images_regions/armoire.gif);
        left: 0px;
        top: 165px;
    }
    
    #armoire1, #armoire2, #armoire3 {
      background-repeat: no-repeat;
      position: relative;
      display: block;
      height: 23px;
      width: 23px;
    }
    DON'T PANIC

  4. #4
    Membre habitué Avatar de avogadro
    Profil pro
    Inscrit en
    Mars 2006
    Messages
    412
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Mars 2006
    Messages : 412
    Points : 188
    Points
    188
    Par défaut
    Citation Envoyé par masu
    pourquoi pas quelquechose comme ca
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    <div id="map">
    <a id="armoire1" href="../robots/alsace_strasbourg.htm"
     target="droite">Strasbourg</a>
    </div>
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    #armoire1 {
        background-image:  url(../images_regions/armoire.gif);
        left: 0px;
        top: 165px;
    }
    
    #armoire1, #armoire2, #armoire3 {
      background-repeat: no-repeat;
      position: relative;
      display: block;
      height: 23px;
      width: 23px;
    }

    vie parfais jy avait pas pensé comme ça merci ...
    =-=-=-=-=-=-=-=-=-=--=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-==-=-=-=-=-=-=-=-=-=-=
    (\_/)
    (O.o)
    (> <)
    This is Bunny. Copy Bunny into your signature to help him on his way to world domination!!
    =-=-=-=-=-=-=-=-=-=--=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-==-=-=-=-=-=-=-=-=-=-=

+ Répondre à la discussion
Cette discussion est résolue.

Discussions similaires

  1. [css] scrollbar dans un div
    Par tooms2028 dans le forum Mise en page CSS
    Réponses: 9
    Dernier message: 17/06/2007, 09h18
  2. ouvrir un lien dans nouvelle page avec css
    Par musicann dans le forum Mise en page CSS
    Réponses: 3
    Dernier message: 13/06/2007, 14h59
  3. ouvrir un lien dans un iframe avec JS
    Par -DeN- dans le forum Balisage (X)HTML et validation W3C
    Réponses: 1
    Dernier message: 27/01/2006, 12h05
  4. [CSS] Utilisation de deux div avec float
    Par Ditch dans le forum Mise en page CSS
    Réponses: 5
    Dernier message: 06/10/2005, 15h48
  5. comment scroller dans un div avec l'evenement onmousemove.
    Par julien.v dans le forum Général JavaScript
    Réponses: 8
    Dernier message: 13/06/2005, 16h08

Partager

Partager
  • Envoyer la discussion sur Viadeo
  • Envoyer la discussion sur Twitter
  • Envoyer la discussion sur Google
  • Envoyer la discussion sur Facebook
  • Envoyer la discussion sur Digg
  • Envoyer la discussion sur Delicious
  • Envoyer la discussion sur MySpace
  • Envoyer la discussion sur Yahoo