Sujets similaires

Sujet: Infobulles: Problème, encore~ Dim 29 Nov 2009, 22:34

Voilà que je galère encore avec mes infobulles x)
Donc voilà mon problème: J'essaie de refaire la page d'Acceuil de mon forum que j'ai entièrement effacé sans le vouloir il y a environ 1 mois. J'ai tout fait, tout va bien, sauf les infobulles.
http://iko-test.forumactif.com/forum.htm
Si on passe le curseur sur les personnages prédéfinis, on voit qu'une partie de l'infobulle passe sous le prédéfini suivant, et qu'en plus il n'y a aucune couleur de fond. Pourtant, je me suis assuré de mettre une couleur de fond partout où ça disant "background-color" dans le CSS de mes infobulles, mais rien y fait.

Le code HTML de ma page d'acceuil:

Spoiler:

Code:: <TABLE>
<TBODY>
<TR colspan=2>
<TD width=65%><DIV class="titres">Informations générales</DIV>
<CENTER><DIV align="left" style="OVERFLOW: auto; WIDTH: 500px; HEIGHT: 150px;">
<FONT size=4><CENTER>Bonjour et bienvenue sur Kiss University!</CENTER></FONT><BR/>
<FONt size=2>Ceci est un forum <STRONG>NC-15</STRONG> puisque certains rps peuvent contenir des scènes de hentaï/yaoi/yuri; si vous n'avez pas l'âge, croyez être choqués ou bien n'aimez pas cela vous n'avez qu'à passer votre chemin.<BR><BR>
Passez régulièrement voir les news! Elles sont postées régulièrement et contiennent beaucoup d'informations importantes concernant le règlement en vigueur et autres.<BR><BR>
- Nous demandons un minimum de 15 lignes par rp.<BR>
- Avant de s'inscrire, lisez bien attentivement le règlement ainsi que le contexte. Consultez également la liste des avatars déjà pris.<BR>
- N'oubliez pas de faire votre présentation avant de pouvoir commencer à rp! Très important aussi de faire la fiche de votre personnage toute suite après avoir été validé.<BR>
- Les inscriptions pour le bal sont maintenant clôturées! Le bal de Noël aura lieu le <strong>15 décembre</strong>. Soyez-y!<BR>
- Il est encore temps de présenter sa bannière pour le concours du prochain design temporaire! Les votes pour le concours auront lieu le <strong>???</strong>.<BR>
- Une nouvelle section dans la catégorie "Art, graphisme, écritures ..." a été ouverte! Il s'agit de la section des défis. Tous sont invités à créer un sujet et à relever les défis des membres.</FONT>
<BR><BR>Design v.4 Bal de Noël Iko’<BR>Contexte Iko' & Za<BR>Page d'acceuil Iko’<BR>Toute reproduction, même partielle, est un délit !</DIV></CENTER></TD>
<TD width=35%><DIV class="titres">Navigation</DIV>
<DIV id="menu"><a href="">Règlements</a>
<a href="">Contexte</a>
<a href="">Avatars pris - garçons</a>
<a href="">Avatars pris - filles</a>
<a href="">Recrutement</a>
<a href="">Groupes étudiants</a>
<a href="">Présentation du staff</a>
</DIV></TD>
</TR>
<TR colspan=2>
<TD width=65%><DIV class="titres">Personnages prédéfinis</DIV>
<center><table>
<tbody>
<tr width=90%>
<td width=15%><div class="thumbnail">
<imguser>
<img src="http://i480.photobucket.com/albums/rr163/Ikotai/JunHeHonda.png">
</imguser>
<span>
<center>
<img src="http://i480.photobucket.com/albums/rr163/Ikotai/JunHeHonda2.png">
<br>
<div>
<strong>Âge:</strong> <br>
         <strong>Nationalité:</strong> <br>
         <strong>Groupe:</strong> <br>
         <strong>Groupe étudiant:</strong> <br>
</div>
</center>
</span>
</div> </td>

<td width=15%><div class="thumbnail">
<imguser>
<img src="http://i480.photobucket.com/albums/rr163/Ikotai/KimStevens.png">
</imguser>
<span>
<center>
<img src="http://i480.photobucket.com/albums/rr163/Ikotai/KimStevens2.png">
<br>
<div>
<strong>Âge:</strong> <br>
         <strong>Nationalité:</strong> <br>
         <strong>Groupe:</strong> <br>
         <strong>Groupe étudiant:</strong> <br>
</div>
</center>
</span>
</div> </td>

<td width=15%><div class="thumbnail">
<imguser>
<img src="http://i480.photobucket.com/albums/rr163/Ikotai/KoenPinkaew.png">
</imguser>
<span>
<center>
<img src="http://i480.photobucket.com/albums/rr163/Ikotai/KoenPinkaew2.png">
<br>
<div>
         <strong>Âge:</strong> <br>
         <strong>Nationalité:</strong> <br>
         <strong>Groupe:</strong> <br>
         <strong>Groupe étudiant:</strong> <br>
</div>
</center>
</span>
</div> </td>

<td width=15%><div class="thumbnail">
<imguser>
<img src="http://i480.photobucket.com/albums/rr163/Ikotai/NicoKanayomi.png">
</imguser>
<span>
<center>
   <div>
<img src="http://i480.photobucket.com/albums/rr163/Ikotai/NicoKanayomi2.png">
<br>
<div>
<strong>Âge:</strong> <br>
         <strong>Nationalité:</strong> <br>
         <strong>Groupe:</strong> <br>
         <strong>Groupe étudiant:</strong> <br>
</div>
</center>
</span>
</div> </td>

<td width=15%><div class="thumbnail">
<imguser>
<img src="http://i480.photobucket.com/albums/rr163/Ikotai/TakeshiUeda.png">
</imguser>
<span>
<center>
<img src="http://i480.photobucket.com/albums/rr163/Ikotai/TakeshiUeda2.png">
<br>
<div>
<strong>Âge:</strong> <br>
         <strong>Nationalité:</strong> <br>
         <strong>Groupe:</strong> <br>
         <strong>Groupe étudiant:</strong> <br>
</div>
</center>
</span>
</div> </td>
<td width=15%><div class="thumbnail">
<imguser>
<img src="http://i480.photobucket.com/albums/rr163/Ikotai/NoahStandford.png">
</imguser>
<span>
<center>
   <div>
   Noah Standford <br>
   feat. <u>Josh Duhamel</u>
   </div>
<img src="http://i480.photobucket.com/albums/rr163/Ikotai/NoahStandford2.png">
<br>
<div>
<strong>Âge:</strong> 25 ans <br>
         <strong>Nationalité:</strong> <br>
         <strong>Groupe:</strong> Élèves masculins <br>
         <strong>Groupe étudiant:</strong> <br>
         <em>Créé par Chad Standford</em> <br>
</div>
</center>
</span>
</div></td>
</tr>
</tbody>
</table></center>
</TD>
<TD width=35%><DIV class="titres">Top Partenaires</DIV>
<CENTER><a href="http://school-of-new-york.forumsactifs.net/"><IMG src="http://i42.servimg.com/u/f42/11/52/26/62/qk12pr10.png"></a><a href="http://css-actif.forumactif.org/"><IMG src="http://files.o-side.com/upload/CSSActif/css-actif-10035.gif"></a><a href="http://theisland.forumakers.com/forum.htm"><IMG src="http://nsa03.casimages.com/img/2008/12/27//081227035610882251.gif"></a>
<a href="http://cleyn-university.forumotion.com/"><IMG src="http://i40.servimg.com/u/f40/12/30/05/37/cleyn_12.png"></a><a href="http://vampire-rpg.forumactif.com/"><IMG src="http://img115.imageshack.us/img115/3107/boutonlien3avg8.jpg"></a><a href="http://centre-isolation.superforum.fr/index.htm"><IMG src="http://i43.tinypic.com/16anoye.jpg"></a>
<a href="http://do-your-life.jeun.fr/index.htm"><IMG src="http://images3.hiboox.com/images/0508/copr6s0l.gif"></a><a href="http://london-bridge.forumotion.com/"><IMG src="http://www.imagehotel.net/images/58rgne9q0g.jpg"></a><a href="http://x-men-dimension.forumactif.org/"><IMG src="http://host.image.files.free.fr/host/4a9e2df400ab4dimension-2.jpg"></a>
<a href="http://aloa-liberta.forumactif.com/"><IMG src="http://i40.tinypic.com/2wbw7li.jpg"></a></CENTER>
</TD>
</TR>
</TBODY>
</TABLE>
<CENTER><IMG src="http://i480.photobucket.com/albums/rr163/Ikotai/Admins-modos-1.png"></CENTER>

Mon CSS entier

Spoiler:

Code:: /* Début du code de Kiss University */
/*Page d'acceuil*/
body {
background-position: top;
background-image: URL("http://obsession27.free.fr/divers/fonds/gr14.jpg")
}

table.bodylinewidth {
position: relative;
top: -15px;
}

.titleforum {
font-family: verdana, "trebuchet MS", "times new roman", "trajan pro", impact, serif;
font-size: 100%;
font-variant: small-caps;
text-align: center;
border-bottom: 1px dotted #5f0101;
color: #FFFFFF;
background-color: #3e0000;
border-left: 5px solid #5f0101;
border-right: 5px solid #5f0101;
}

.titleforum:hover {
font-family: verdana, "trebuchet MS", "times new roman", "trajan pro", impact, serif;
font-size: 110%;
text-transform: uppercase;
text-align: center;
border-bottom: 1px dotted #3e0000;
color: #FFFFFF;
background-color: #5f0101;
border-left: 5px solid #3e0000;
border-right: 5px solid #3e0000;
letter-spacing: 2px;
}

td.row1 {
background-repeat: repeat;
background-image: url("http://obsession27.free.fr/divers/fonds/mi.gif");
background-position: center;
}
td.row2 {
background-repeat: repeat;
background-image: url("http://obsession27.free.fr/divers/fonds/mi.gif");
background-position: center;
}
td.row3 {
background-repeat: repeat;
background-image: url("http://obsession27.free.fr/divers/fonds/mi.gif");
background-position: center;
}

/*Message d'acceuil*/
a.imginfo {
position: relative;
color: #363636;
text-decoration: none;
border-bottom: 1px #363636 dashed;
}

#menu a:link, #menu a:visited{
margin-left : 9px;
margin-right : 9px;
display: block;
font-family : verdana, "trebuchet MS", "times new roman", "trajan pro", impact, serif;
color: #d2d2d2;
background-color: #2e2d2d;
text-align: center;
border-left: 9px solid #361B1B;
border-right: 9px solid #361B1B;
border-top: 1px solid #361B1B;
border-bottom: 1px solid #361B1B;
font-size: 12px;
margin-top: 4px;
margin-bottom: 4px
}

#menu a:hover, #menu a:hover:visited{
color: #575555;
font-size: 12px;
letter-spacing: 1px;
background-color: #212121;
border-left: 9px solid #361B1B;
border-right: 9px solid #361B1B;
border-top: 1px solid #361B1B;
border-bottom: 1px solid #361B1B;
margin-left: 2px;
margin-right: 2px;
}

/*Infobulles*/
.thumbnail{
position: relative;
z-index: 0;
}
.thumbnail:hover{
background-color: #FFFFFF;
z-index: 50;
}
.thumbnail span{ /*CSS de l'info-bulle*/
position: absolute;
background-color: #FFFFFF
padding: 2px;
left: -1000px;
border: 2px dashed #361B1B; /*Bordure de l'info-bulle*/
visibility: hidden;
color: #000000; /*Couleur du texte de l'info-bulle*/
text-decoration: none; /*Décoration du texte de l'info-bulle*/
}
.thumbnail span img{ /*CSS for enlarged image*/
border-width: 0px;
padding: 2px;
}
.thumbnail:hover span{ /*CSS for enlarged image on hover*/
visibility: visible;
top: 53px;
left: 25px; /*position where enlarged image should offset horizontally */
width: 150px; /*Largeur de l'info-bulle*/
}
a imguser {
border: none;
background-color: #FFFFFF;
}
a:hover imguser {
border: none;
background-color: #FFFFFF;
}
imguser {
border: none;
background-color: #FFFFFF;
}
imguser:hover{
border: none;
background-color: #FFFFFF;
}

/*Messages*/
.titres {
font-family: verdana, "trebuchet MS", "times new roman", "trajan pro", impact, serif;
font-size: 15px;
font-variant: small-caps;
text-align: center;
border-bottom: 1px dotted #5f0101;
color: #FFFFFF;
background-color: #3e0000;
border-left: 5px solid #5f0101;
border-right: 5px solid #5f0101;
}

/*Liens et texte*/
a {
text-decoration: none;
font-variant: small-caps;
}

La partie du CSS qui ne concerne que les infobulles

Spoiler:

Merci à l'âme charitable qui acceptera de m'aider o.o

EDIT: Avec Firefox, les infobulles ne passent pas sous les autres images des prédefs mais ayant Internet Explorer comme navigateur principal *et n'étant pas la seule de mon forum à l'avoir* j'aimerais quand même savoir comment règler le problème... mais même sous Firefox le problème des infobulles transparentes persiste.

Sujet: Re: Infobulles: Problème, encore~ Lun 30 Nov 2009, 13:01

Aurais-tu.... Simplement oublié le point virgule dans ton CSS ?

Spoiler:

Sujet: Re: Infobulles: Problème, encore~ Lun 30 Nov 2009, 17:38

Ha ouais tellement x.x merci

Mais sur IE ça me fait encore le problème que l'image des autres prédéfinis passent par dessus l'infobulle o.o

Je ne sais pas, personnellement, je vois la même chose sur les deux : Sous Mozilla et sur IE....

C'est ptêtre mon PC qui bugue... quoi qu'il en soit... je vais mettre le code comme ça sur mon acceuil et je vais demander aux gens de voir si ils ont un bug semblable. Si non, ça veut dire que c'est que moi ô_o" je te reviens là dessus dès que possible~ x)

Okay !!

Sujet terminé donc ? =D

sorry pour le retard~
Ouiii, sujet terminé, il semblerait que ce n'est que moi qui a le problème.
Je déplace toute seule \o/

Infobulles: Problème, encore~

Infobulles: Problème, encore~

Sujets similaires

Sujets similaires

Partenaires Or