Infobulle ne s'affiche pas correctement
Forum gratuit : Le forum des forums actifs :: Entraide & Support... :: Gérer l'apparence de son forum :: Archives des problèmes avec l'apparence du forum
Page 1 sur 1 • Partagez
Infobulle ne s'affiche pas correctement
Bonjour, bonsoir!
Et oui, comme d'habitude j'ai un problème que je n'arrive pas à comprendre. x)
J'ai un petit problème avec mon infobulle sur ma page d'accueil, j'ai beau à regarder mon CSS, je vois pas où est le problème. Car sur Firefox, l'infobulle est niquel et quand je vais sur Safari, c'est pas vraiment jolie-jolie à voir. Alors que quand je vais sur d'autres forums avec Safari, je peux voir les infobulles correctement, donc je sais pas trop où est le problème avec mon infobulle.
Je vous donne quelques images pour voir.
Sur Safari vue sur mon infobulle dans la P.A.:
Sur Firefox vue sur mon infobulle dans la P.A.:
Voici la CSS de mon infobulle si besoin :
Voici le code HTML que j'utilise dans ma page d'accueil :
Merci d'avance à celle ou celui qui me donnera un petit coup de main. ^^
Et oui, comme d'habitude j'ai un problème que je n'arrive pas à comprendre. x)
J'ai un petit problème avec mon infobulle sur ma page d'accueil, j'ai beau à regarder mon CSS, je vois pas où est le problème. Car sur Firefox, l'infobulle est niquel et quand je vais sur Safari, c'est pas vraiment jolie-jolie à voir. Alors que quand je vais sur d'autres forums avec Safari, je peux voir les infobulles correctement, donc je sais pas trop où est le problème avec mon infobulle.
Je vous donne quelques images pour voir.
Sur Safari vue sur mon infobulle dans la P.A.:
Sur Firefox vue sur mon infobulle dans la P.A.:
Voici la CSS de mon infobulle si besoin :
- Code:
a.infobulle {
position: relative;
}
a.infobulle span {
display: none; /* ceci masque l'infobulle */
}
a.infobulle:hover {
background: none; /* correction d'un bug IE */
z-index: 999; /* on définit une valeur pour l'ordre d'affichage */
cursor: hand;
position: relative;
text-decoration:none;
border: 0;
}
a.infobulle:hover span {
display: inline; /* ceci affiche l'infobulle */
position: absolute;
white-space: nowrap; /* on change la valeur de la propriété white-space pour qu'il n'y ait pas de retour à la ligne non-désiré */
top: 0px; /* on positionne notre infobulle */
left: 50px;
background: #ffffff ; /* arrière-plan de l'infobulle */
color: #000000; /* texte dans l'infobulle */
padding: 3px;
/* bordures de votre infobulle*/
border: 4px solid AliceBlue;
border-left: 2px solid MediumTurquoise;
border-right: 2px solid MediumTurquoise ;}
Voici le code HTML que j'utilise dans ma page d'accueil :
- Code:
<a href="#" class="infobulle"><img style="border:4px solid AliceBlue; border-left: 2px solid MediumTurquoise; border-right: 2px solid MediumTurquoise;"src="http://img851.imageshack.us/img851/6281/iconpa.png" width="50" height="50"/><span><center><font color= MediumTurquoise >Hisashi Isamu</font><br><font color=MediumTurquoise >The Natural one</font><br>
<img src="http://img585.imageshack.us/img585/2056/iconpacolor.png"><div><a href="http://og-rpg-test.forumactif.org/u1rpg"_blank">Me</div><div><a href="http://og-rpg-test.forumactif.org/privmsg?mode=post&u=1"_blank">M.P. me</div>
Merci d'avance à celle ou celui qui me donnera un petit coup de main. ^^
Dernière édition par Miya Yoshizumi le Mer 4 Mai 2011 - 18:58, édité 1 fois
Re: Infobulle ne s'affiche pas correctement
Uhhh... Un petit up? n_n''
Re: Infobulle ne s'affiche pas correctement
Bonsoir,
Safari faisait la tête, mais Firefox 4 aussi sur mon forum test . En remplaçant <a href="#" class="infobulle">....</a> par <div class="infobulle">....</div> dans votre code
et en changeant le CSS comme ci-dessous, ça fonctionne:
Cordialement.
Safari faisait la tête, mais Firefox 4 aussi sur mon forum test . En remplaçant <a href="#" class="infobulle">....</a> par <div class="infobulle">....</div> dans votre code
- Code:
<div class="infobulle"><img style="border:4px solid AliceBlue; border-left: 2px solid MediumTurquoise; border-right: 2px solid MediumTurquoise;"src="http://img851.imageshack.us/img851/6281/iconpa.png" width="50" height="50"/><span><center><font color= MediumTurquoise >Hisashi Isamu</font><br><font color=MediumTurquoise >The Natural one</font><br>
<img src="http://img585.imageshack.us/img585/2056/iconpacolor.png"><div><a href="http://og-rpg-test.forumactif.org/u1rpg"_blank">Me</div><div><a href="http://og-rpg-test.forumactif.org/privmsg?mode=post&u=1"_blank">M.P. me</div></span></div>
et en changeant le CSS comme ci-dessous, ça fonctionne:
- Code:
.infobulle {
position: relative;
}
.infobulle span {
display: none; /* ceci masque l'infobulle */
}
.infobulle:hover {
background: none; /* correction d'un bug IE */
z-index: 999; /* on définit une valeur pour l'ordre d'affichage */
cursor: hand;
position: relative;
text-decoration:none;
border: 0;
}
.infobulle:hover span {
display: inline; /* ceci affiche l'infobulle */
position: absolute;
white-space: nowrap; /* on change la valeur de la propriété white-space pour qu'il n'y ait pas de retour à la ligne non-désiré */
top: 0px; /* on positionne notre infobulle */
left: 50px;
background: #ffffff ; /* arrière-plan de l'infobulle */
color: #000000; /* texte dans l'infobulle */
padding: 3px;
/* bordures de votre infobulle*/
border: 4px solid AliceBlue;
border-left: 2px solid MediumTurquoise;
border-right: 2px solid MediumTurquoise ;}
Cordialement.
Invité- Invité
Re: Infobulle ne s'affiche pas correctement
Oh! Merci beaucoup Isolde!
Ce code marche parfaitement. :3
Vous êtes vraiment ma sauveuse! x)
Merci encore!
Ce code marche parfaitement. :3
Vous êtes vraiment ma sauveuse! x)
Merci encore!
Sujets similaires
» bonsoir le dernier membre inscrit ne saffiche pas
» Avatar qui ne s'affiche pas correctement
» Image ne se met pas correctement
» Toolbar ne fonctionne pas correctement
» mon forum ne s'affiche pas correctement
» Avatar qui ne s'affiche pas correctement
» Image ne se met pas correctement
» Toolbar ne fonctionne pas correctement
» mon forum ne s'affiche pas correctement
Forum gratuit : Le forum des forums actifs :: Entraide & Support... :: Gérer l'apparence de son forum :: Archives des problèmes avec l'apparence du forum
Page 1 sur 1
Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum