Image d'une taille et son infobulle-image d'une autre taille

2 participants

Voir le sujet précédent Voir le sujet suivant Aller en bas

Résolu Image d'une taille et son infobulle-image d'une autre taille

Message par Kerta Mer 1 Nov 2017 - 14:40

Détails techniques


Version du forum : phpBB3
Poste occupé : Fondateur
Navigateur(s) concerné(s) : Google Chrome
Personnes concernées par le problème : Tous les utilisateurs
Lien du forum : (lien masqué, vous devez poster pour le voir)

Description du problème

Bonjour,
Je m'excuse de vous déranger,
Merci pour votre aide...

En faite, j'ai une image:
Image d'une taille et son infobulle-image d'une autre taille 795006Capture

De taille 40*40

Et j'ai une infobulle image dessus:
Image d'une taille et son infobulle-image d'une autre taille 462550Sanstitre3

Je voudrais que l'infobulle reste de 40*40 mais que l'image sous <span> passe à 100*35

Code:
/*Partie partenaires*/
.partner {
  height: 100px;
    left: -525px;
    position: relative;
    top: 75px;
    width: 213px;
}
.partner img {
  height: 50px;
  width:50px;
  border-radius: 50px;
}
.part2{
  position: relative;
    text-align: center;
    width: 200px;
    top: 70px;
    left: -420px;
}

#partner1 {
  left: 5px;
    position: relative;
    top: -2px;
}
#partner2 {
    left: -70px;
    top: 10px;
    position: relative;
}
#partner3 {
    left: -70px;
    top: 10px;
    position: relative;
}
#partner4 {
    left: -70px;
    top: 10px;
    position: relative;
}
#partner5 {
    left: -70px;
    top: 10px;
    position: relative;
}
#partner6 {
    left: -70px;
    top: 10px;
    position: relative;
}
a.partv {
  display: inline-block;
}
a.partv span {
  display: none; /* On masque l'infobulle. */
}
a.partv:hover {
  background: none; /* Correction d'un bug d'Internet Explorer. */
  z-index: 500; /* On définit une valeur pour l'ordre d'affichage. */ 
}
a.partv:hover span {
display: inline-block;
    height: 35px;
    position: absolute;
    text-align: center;
    width: 135px;
    top: -2px;
    left: -120px;
}


/*Fin partie partenaires*/

Code:
<td style="height: 125px;">
                                                                                                                                                                                                                                                                                                          
               <div class="partner">
                                          <a id="partner1" class="partv" href="lien"><img src="https://img4.hostingpics.net/pics/703841MAbouton2.png" /><span> <img src="https://img4.hostingpics.net/pics/703841MAbouton2.png" /></span> </a>       
               </div>
               
               <div class="part2">
                                                            <a href="http://newexitopia.forumactif.com/t50-demandes-de-partenariat">♣️ Vous ? </a><br /><a href="http://newexitopia.forumactif.com/t44-nos-beaux-partenaires">♣️ Tous </a>         
               </div>
                                                                                                                                                                
            </td>

Mais je dois avouer que je ne sais pas comment faire... Merci par avance pour votre aide
avatar

Kerta
Nouveau membre

Messages : 28
Inscrit(e) le : 10/05/2014

Voir le profil de l'utilisateur http://prior-incanto.lebonforum.com/register?agreed=true&ste
Kerta a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Image d'une taille et son infobulle-image d'une autre taille

Message par Kerta Ven 3 Nov 2017 - 9:44

Si quelqu'un a une idée... Je n'arrive tjrs pas régler la taille de l'infobulle sans que cela n'affecte l'image
avatar

Kerta
Nouveau membre

Messages : 28
Inscrit(e) le : 10/05/2014

Voir le profil de l'utilisateur http://prior-incanto.lebonforum.com/register?agreed=true&ste
Kerta a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Image d'une taille et son infobulle-image d'une autre taille

Message par tupac Ven 3 Nov 2017 - 16:19

Bonjour Kerta, en définissant la taille de l'image directement dans la balise IMG devrait résoudre le problème.
Code:
<img src=" votre image ici " alt="" height="40" width="40">
tupac

tupac
Membre actif

Masculin
Messages : 2551
Inscrit(e) le : 13/10/2010

Voir le profil de l'utilisateur http://codactif.monalliance.com/
tupac a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Image d'une taille et son infobulle-image d'une autre taille

Message par Kerta Ven 3 Nov 2017 - 17:07

Bonsoir,
J'ai essayé mais cela n'a rien changé... L'image sous infobulle n'a pas pris la taille de 100*35
Elle est restée de la taille de l'image de base
avatar

Kerta
Nouveau membre

Messages : 28
Inscrit(e) le : 10/05/2014

Voir le profil de l'utilisateur http://prior-incanto.lebonforum.com/register?agreed=true&ste
Kerta a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Image d'une taille et son infobulle-image d'une autre taille

Message par tupac Ven 3 Nov 2017 - 21:21

Le problème est que la class partner img englobe vos deux images donc celles-ci prennent logiquement la hauteur et largeur de 50px.

Supprimer ceci de votre css.
Code:
.partner img {
  height: 50px;
  width:50px;
  border-radius: 50px;
}
Remplacez le par celui-la.
Code:
.image_partv{
  height:50px;
  width:50px;
  -moz-border-radius:50px;
  -webkit-border-radius:50px;
  border-radius:50px;
}
Pour finir j'ai ajouté la class image_partv a votre première image comme ceci.
Code:
<div class="partner">
<a href="lien" class="partv" id="partner1">
<img src="https://img4.hostingpics.net/pics/703841MAbouton2.png" class="image_partv" /><span>
<img src="https://img4.hostingpics.net/pics/703841MAbouton2.png" /></span>
</a>                     
</div>

tupac

tupac
Membre actif

Masculin
Messages : 2551
Inscrit(e) le : 13/10/2010

Voir le profil de l'utilisateur http://codactif.monalliance.com/
tupac a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Image d'une taille et son infobulle-image d'une autre taille

Message par Kerta Sam 4 Nov 2017 - 9:05

Bonjour,
Le code fonctionne. Et je comprends mieux mon erreur. Je voyais bien que tout était englobé et que ça modifié le tout. Mais je n'avais pas la logique pour résoudre ce problème. Merci en tout de votre aide.
Bonne journée.
avatar

Kerta
Nouveau membre

Messages : 28
Inscrit(e) le : 10/05/2014

Voir le profil de l'utilisateur http://prior-incanto.lebonforum.com/register?agreed=true&ste
Kerta a été remercié(e) par l'auteur de ce sujet.

Voir le sujet précédent Voir le sujet suivant Revenir en haut

- Sujets similaires

Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum