Sujets similaires

Bonjour.

Je viens de créer un forum et je suis en train de faire le message d'accueil mais je bloque sur les infobulles. Elles s'affichent bien sauf que les liens que je veux mettre dans l'infobulle se retrouvent à l'extérieur de l'infobulle. Voilà mon code :

Code:: <a href="#" class="info"><img src="http://i35.servimg.com/u/f35/15/25/23/27/anna_p16.png"><span><img src="http://i35.servimg.com/u/f35/15/25/23/27/anna_p14.png"><br>Delphine Guillet<br>Administratrice<br><div><a href="http://voyagearoundtheworld.forumsactifs.com/profile.forum?mode=viewprofile&u=1?sid=35da39c37f3974e1630283ea272a589e" target="_blank">PROFIL</a></div>
- <div><a href="http://voyagearoundtheworld.forumsactifs.com/msg.forum?mode=post&u=1?sid=35da39c37f3974e1630283ea272a589e" target="_blank">CONTACTER</a></div></span></a>

Lien du forum.
Merci d'avance.

https://css-actif.forumactif.org/astuces-f33/faire-une-infobulle-t103.htm
Suis bien le tutoriel, parce qu'il n'y a pas que la partie HTML dans l'infobulle, il y a aussi une partie CSS. À moins que tu n'en aies une mais que tu ne l'as pas montrée ?

Et avant qu'on te passe un savon, tu devrais retirer le lien de ta signature :/

Si, j'ai un code CSS :

Code:: * {
font-size: 12px; /* on définit les propriétés de texte pour toutes les balises */
font-family: Tahoma;
}
a.info {
position: relative;
color: black;
text-decoration: none;
border-bottom: 1px gray dotted; /* on souligne le texte */
}
a.info span {
display: none; /* on masque l'infobulle */
}
a.info:hover {
background: none; /* correction d'un bug IE */
z-index: 999; /* on définit une valeur pour l'ordre d'affichage */

cursor: help; /* on change le curseur par défaut en curseur d'aide */
}
a.info:hover span {
display: inline; /* on 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: 670px; /* on positionne notre infobulle */
left: 365px;

background: white;

color: #42362E;
padding: 3px;

border: 2px solid #786C54;
}

Pour le lien, c'est pas ma signature, c'est dans mon message, c'est pour que vous puissiez voir le résultat. Je peux l'enlever quand même si vous voulez.

EDIt : J'ai un autre problème, je l'ai mis dans le même sujet pour qu'il n'y en ai pas 1 de plus.

La plupart de mes codes CSS ne fonctionnent pas. Je ne sais pas du tout pourquoi, peut-être que c'est un bug de forum actif mais je ne pense pas. Voilà mon code CSS entier.

Spoiler:

Code:: /*--- Bordure du forum ---*\
.bodyline{border: 13px solid #423628; }

/*--- Fond ---*\
body {background-repeat: no-repeat; background-position: top center;
}

/*--- Liens du forum ---*\
a.forumlink{
font: normal 12px Comic Sans MS
display:block;
text-align: center ;
text-transform : uppercase ;
border-bottom: 2px solid #423628;
display: block;
background-color : #B5AB98;
-moz-border-radius;
}

a {
a:link,a:active {
COLOR: #423628;
text-decoration: none
}
a:visited {color: #423628;
text-decoration: none
}
color: #423628;
text-decoration: none
}

a:hover{
color: #6B5339;
font-variant: small-caps;
text-decoration: none
}

/*--- Curseur ---*\
a:hover
{
cursor: sw-resize;
}

/*--- Lettrine ---*\
.lettrine {
float: left;
font-size : 40px;
padding-top : 10px;
margin-bottom : 4px;
}

/*--- Barre de navigation en majuscule ---*\
a.mainmenu{text-transform: uppercase;}

/*--- Avatar ---*\
.fondavatar {
background-color : #76BABF;
border : 3px solid #423628;
-moz-border-radius: 5px 5px 5px 5px
padding : 3px ; }

/*--- Signatures trop longues ---*\
.signature_div {
overflow: hidden;
width: 550px;
height: 400px;
}

/*--- Apparence des codes ---*\
.code {
background-color: #B5AB98; /* couleur noire du fond */
border:1px #ffffff dashed; /* bordure blanche en traits peu épais */
-border-radius: 15px; /* tous les côtés sont arrondis */
-moz-border-radius: 15px; /* tous les côtés sont arrondis */
-webkit-border-radius: 15px; /* tous les côtés sont arrondis */
color: #42362E; /* couleur du texte blanche */
}

/*--- Apparence des citations ---*\
.quote {
background-color: #B5AB98; /* couleur noire du fond */
border:1px #ffffff dashed; /* bordure blanche en traits peu épais */
-border-radius: 15px; /* tous les côtés sont arrondis */
-moz-border-radius: 15px; /* tous les côtés sont arrondis */
-webkit-border-radius: 15px; /* tous les côtés sont arrondis */
color: #42362E; /* couleur du texte blanche */
}

/*--- Apparence des spoilers fermés ---*\
.spoiler_closed{
background-color: #B5AB98; /* couleur noire du fond */
border:1px #ffffff dashed; /* bordure blanche en traits peu épais */
-border-radius: 15px; /* tous les côtés sont arrondis */
-moz-border-radius: 15px; /* tous les côtés sont arrondis */
-webkit-border-radius: 15px; /* tous les côtés sont arrondis */
color: #42362E; /* couleur du texte blanche */
}

/*--- Apparence des spoilers ouverts ---*\
.spoiler_content{
background-color: #B5AB98; /* couleur noire du fond */
border:1px #ffffff dashed; /* bordure blanche en traits peu épais */
-border-radius: 15px; /* tous les côtés sont arrondis */
-moz-border-radius: 15px; /* tous les côtés sont arrondis */
-webkit-border-radius: 15px; /* tous les côtés sont arrondis */
color: #42362E; /* couleur du texte blanche */
}

/*--- Fiche ---*\
.fiche {
background-color: #B5AB98; /*--- Couleur de fond ---*/
border: 1px dashed #42362E; /*--- Taille, type et couleur de la bordure ---*/
color: #42362E; /*--- Couleur du texte ---*/
padding-left: 55px; /*--- On espace la bordure gauche du texte de 30px ---*/
}

.Forum1
{border-bottom: 3px solid #423628}

.Sousforum1 {
background-color: #B5AB98;
-moz-border-radius: 5px;
padding-right: 10px;
padding-left: 10px;
padding-bottom: 3px;
font-family: Georgia;
}

/*--- Cette partie correspond à la description des catégories ---*\
.descri {
background-color: #B5AB98;
border: #6E6658 2px solid;
-moz-border-radius: 15px 15px 15px 15px;
}

/*--- Cette partie correspond à l'onglet "X messages dans X sujets" ---*/
.forum-stats {
-moz-border-radius-topleft: 20px;
-moz-border-radius-topright: 20px;
-webkit-border-top-right-radius: 20px;
-webkit-border-top-left-radius: 20px;
border-top-right-radius: 20px;
border-top-left-radius: 20px;
border-bottom: 0 none !important;
border-left: 3px solid #76BABF;
border-right: 3px solid #76BABF;
border-top: 3px solid #76BABF;
color: #423628;
background-color : #B8CF9D;
font-size: 11px;
font-style: italic;
height: 14px;
left: 280px;
padding: 3px;
position: relative;
text-align: center;
width: 200px;
}

/*--- Cette partie correspond à l'affichage des sous-forums ---*/
.forum-sousforum {
color: #000000;
border: 3px solid #76BABF;
border-top: 0px !important;
-moz-border-radius-bottomleft: 14px;
-moz-border-radius-bottomright: 14px;
-webkit-border-bottom-right-radius: 14px;
-webkit-border-bottom-left-radius: 14px;
border-bottom-right-radius: 14px;
border-bottom-left-radius: 14px;
margin: auto;
padding: 4px;
color: #000000;
background-color : #B8CF9D;
width: 50%;
text-align: center;
height: 14px;
font-size: 11px;
}

/* Ecriture aligné *\
.postbody {
display: block;
padding-left: 30px;
padding-right: 15px;
text-align:justify;
}

/*--- Enlever "Editer par ..." ---*\
tr.post span.gensmall { display: none; }

/*--- Infobulle ---*\
* {
font-size: 12px; /* on définit les propriétés de texte pour toutes les balises */
font-family: Tahoma;
}
a.info {
position: relative;
color: black;
text-decoration: none;
border-bottom: 1px gray dotted; /* on souligne le texte */
}
a.info span {
display: none; /* on masque l'infobulle */
}
a.info:hover {
background: none; /* correction d'un bug IE */
z-index: 999; /* on définit une valeur pour l'ordre d'affichage */

cursor: help; /* on change le curseur par défaut en curseur d'aide */
}
a.info:hover span {
display: inline; /* on 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: 670px; /* on positionne notre infobulle */
left: 365px;

background: white;

color: #42362E;
padding: 3px;

border: 2px solid #786C54;
}

Salut,

dans ton code je vois :

Code:: a {

sans fermeture.

Soi tu le supprimes, soit tu ajoutes } après, mais tu ne peux pas le laisser comme ça ^^;

Je ne garantis pas que ça règlera ton problème mais il est possible que celui-ci vienne de là.

Je pense que tu parles de ça :

Code:: a {
a:link,a:active {
COLOR: #423628;
text-decoration: none
}
a:visited {color: #423628;
text-decoration: none
}
color: #423628;
text-decoration: none
}

En fait, le a englobe tout ça :

Code:: a:link,a:active {
COLOR: #423628;
text-decoration: none
}
a:visited {color: #423628;
text-decoration: none
}
color: #423628;
text-decoration: none

Et il y a un } à la fin. Smile

Le problème est -il résolu ?

Oui c'est bon maintenant. Smile

Vous pouvez fermer.

Problème de liens dans infobulle + CSS qui ne marche plus

Problème de liens dans infobulle + CSS qui ne marche plus

Sujets similaires

Sujets similaires

Partenaires Or