problème d'alignement pa

par Loü Mer 29 Mai 2013 - 22:06

Bonsoir

Je rencontre un petit souci d'alignement sur ma page d'accueil. Il s'agit des icons annonçant les membres du staff... Elles s'affichent l'une en dessous de l'autre alors que je leur ordonne en vain de se ranger côte à côte. Quelqu'un peut il m'aider ?

Voici le code de la PA :

Code:: <div style="text-align:center;width:100%;"><img src="http://img11.hostingpics.net/pics/600249Bannpa.png" border="0" alt="" /></div><div style="text-align: jusitfy; line-height:12px; width:97%; padding:3px; background-color: #000000;"> <div style="-moz-border-radius:10px; -webkit-border-radius:10px; text-transform: uppercase; font-size:12px; font-family:megrim; background-color:#000000;text-align:center; padding:5px;"><img src="http://images.khinsider.com/Kingdom%20Hearts/Kingdom%20Hearts%201%20Renders/Characters/Halloween%20Town/character01%20-%20jack.png" border="0" width="60px" alt="" /><b> <a href="http://enattente.roleaddict.com/t22-headshot-reglement"><font color="khaki">règlement</font></a> <font color="#8E8331">✝ </font> <a href="http://enattente.roleaddict.com/t23-intrigue-n1-the-wacky-show"><font color="khaki">intrigues</font></a> <font color="#8E8331">✝ </font> <a href="http://enattente.roleaddict.com/t6-registres-des-avatars"><font color="khaki">avatars</font></a> <font color="#8E8331">✝ </font> <a href="http://enattente.roleaddict.com/f5-les-avis-de-recherche"><font color="khaki">scénarii</font></a> <font color="#8E8331">✝ </font> <a href="http://enattente.roleaddict.com/t7-specialites-et-annees-d-etude"><font color="khaki">invités</font></a> <font color="#8E8331">✝ </font> <a href="http://enattente.roleaddict.com/f4-zone-pour-indic"><font color="khaki">partenariats</font></a> </b></div></div></div> <table border="0"><tr><td align=left><div style="text-align: justify;padding:10px; background-color:#000000; width: 360px;height:150px;border: 5px solid #000000;"><span style="font-size: 16pt; letter-spacing:-2px;line-height: normal;text-shadow: khaki 3px 3px 3px;font-family:nothing you could do;align:center;"><center><font color="#8E8331"><strong>mémoires sataniques</strong></font></center></span><span style="font-size: 9px; line-height: normal"><br/> Fear is god ! Les ombres se meuvent en cauchemars et l'amour en angoisse. On les appelle les maudits, les âmes grises, les condamnés. Ils vivent parmi nous dans cet enfer clair obscur, dans ce cimetière de l'insouciance crucifiée. Ce sont nos amis, nos voisins, nos prédateurs les plus terrifiants. Leur désespoir est aussi incommensurable que leurs terribles desseins ! Ils sont les bourreaux et les victimes, les acteurs du grand théâtre démoniaque. Ils se révèlent lorsque le voile de la nuit maquille le ciel, fatalement transformés par leur malédiction. <a href="http://enattente.roleaddict.com/t21-headshot-contexte?tid=ceb6c15ff4a74d35361232af2eb002bb" class="postlink">◢ Lire la suite...</a></span> </div></div></div></div></td><td align=left><div style="padding: 10px;text-align: justify; background-color:#000000; width:410px;height:150px;border: 5px solid #000000;font-size:10px; "><span style="font-size: 16pt; letter-spacing:-2px;text-shadow: khaki 3px 3px 3px;line-height: normal;font-family:nothing you could do"><center><font color="#8E8331"><strong>news démoniaques</strong></font></center></span><br/><div align="justify">♠ <b>création du forum</b> 25.05.2013<br/> <b>♠ ouverture du forum</b> 00.00.2013<br/> <b>♠ e. c</b><br/> <b>♠ e. c</b><br/><br/> <center><b>FORUM </b> <img src="http://media.maison-facile.com/img/article/d131000d.gif" border="0" width="16px" alt="" /></center><div align="center"><div style="height:120px; overflow:auto; padding-right: 20px;"><span style="font-size: 10px;font-family:megrim; text-shadow: khaki 3px 3px 3px;line-height: normal;">Nous sommes en 2013, dans la petite ville fictive de Cursed Town, en plein coeur du Maine (USA). Bienvenue en enfer !</span></div></div></div></div> </div></div></div></td></tr></table> <center><table border="0"><tr><td align="center"><div style="padding: 15px;text-align: justify; background-color:#000000;width: 240px; height: 180px;border: 5px solid #000000; "><div align="justify"><center><span style="font-size: 16pt; letter-spacing:-2px;line-height: normal;text-shadow: khaki 3px 3px 3px;font-family:nothing you could do"><font color="#8E8331"><strong>succubes XXX</strong></font></span><br/><br/> <table><tr> <td><div class="thumbnail"> <img src="http://decemberelegy.free.fr/Icons/Films/avavendetta22.png" width="30px"> <span><div class="tstaff" align="center"> <img src="http://decemberelegy.free.fr/Icons/Films/avavendetta22.png"><br> <div align="justify"><center> <i>ARTEMIS STENDHAL</i><br/> <a href="http://cursedtown.forumactif.org/privmsg?mode=post&u=1" class="postlink">mp</a> ✝ <a href="http://cursedtown.forumactif.org/u1" class="postlink">profil</a> </div></span></td></tr><tr><td> </div><div class="thumbnail"> <img src="http://decemberelegy.free.fr/Icons/Films/avavendetta22.png" width="30px"> <span><div class="tstaff" align="center"> <img src="http://decemberelegy.free.fr/Icons/Films/avavendetta22.png"><br> <i>CILLIEN ELIACIN</i><br/> <a href="http://cursedtown.forumactif.org/privmsg?mode=post&u=2" class="postlink">mp</a> ✝ <a href="http://cursedtown.forumactif.org/u2" class="postlink">profil</a> </div></span> </div> </td></tr> <tr><td> </div><div class="thumbnail"> <img src="http://decemberelegy.free.fr/Icons/Films/avavendetta22.png" width="30px"> <span><div class="tstaff" align="center"> <img src="http://decemberelegy.free.fr/Icons/Films/avavendetta22.png"><br> <i>MIRKHA MILODRAG</i><br/> <a href="http://cursedtown.forumactif.org/privmsg?mode=post&u=3" class="postlink">mp</a> ✝ <a href="http://cursedtown.forumactif.org/u3" class="postlink">profil</a> </div></span> </div> </td></tr></table> <span style="font-size: 10px; font-family:megrim;text-shadow: khaki 3px 3px 3px"><font color=#8E8331><br/>Vos administratrices infernales, pour vous servir jusqu'à la mort !</font></span> </td><td align="left"> <div style="padding: 15px;text-align: justify; background-color:#000000;text-shadow: khaki 3px 3px 3px;width: 200px; height: 180px;border: 5px solid #000000; "><div style="margin:auto;text-align:center;width:100%"><center><span style="font-size: 16pt;font-family:nothing you could do;letter-spacing:-2px; line-height: normal"><font color="#8E8331"><strong>puissances alliées</strong></font></span></center><span style="font-size: 10px; font-family:megrim"><font color=#8E8331><br/>Découvrez nos coups de coeur !<br/><br/></font></span> <a href="http://enattente.roleaddict.com?tid=ceb6c15ff4a74d35361232af2eb002bb" class="postlink"><img src="http://img11.hostingpics.net/pics/1351371.png" border="0" width="30px" alt="" /></a> <a href="http://enattente.roleaddict.com?tid=ceb6c15ff4a74d35361232af2eb002bb" class="postlink"><img src="http://img11.hostingpics.net/pics/1351371.png" border="0" width="30px" alt="" /></a> <a href="http://enattente.roleaddict.com?tid=ceb6c15ff4a74d35361232af2eb002bb" class="postlink"><img src="http://img11.hostingpics.net/pics/1351371.png" border="0" width="30px" alt="" /></a> <a href="http://enattente.roleaddict.com?tid=ceb6c15ff4a74d35361232af2eb002bb" class="postlink"><img src="http://img11.hostingpics.net/pics/1351371.png" border="0" width="30px" alt="" /></a> <a href="http://enattente.roleaddict.com?tid=ceb6c15ff4a74d35361232af2eb002bb" class="postlink"><img src="http://img11.hostingpics.net/pics/1351371.png" border="0" width="30px" alt="" /></a> <a href="http://enattente.roleaddict.com?tid=ceb6c15ff4a74d35361232af2eb002bb" class="postlink"><img src="http://img11.hostingpics.net/pics/1351371.png" border="0" width="30px" alt="" /></a> <a href="http://enattente.roleaddict.com?tid=ceb6c15ff4a74d35361232af2eb002bb" class="postlink"><img src="http://img11.hostingpics.net/pics/1351371.png" border="0" width="30px" alt="" /></a> <a href="http://enattente.roleaddict.com?tid=ceb6c15ff4a74d35361232af2eb002bb" class="postlink"><img src="http://img11.hostingpics.net/pics/1351371.png" border="0" width="30px" alt="" /></a> <a href="http://enattente.roleaddict.com?tid=ceb6c15ff4a74d35361232af2eb002bb" class="postlink"><img src="http://img11.hostingpics.net/pics/1351371.png" border="0" width="30px" alt="" /></a> <a href="http://enattente.roleaddict.com?tid=ceb6c15ff4a74d35361232af2eb002bb" class="postlink"><img src="http://img11.hostingpics.net/pics/1351371.png" border="0" width="30px" alt="" /></a><div align="center"><div style="height:120px; overflow:auto; padding-right: 10px;"><span style="font-size: 10px;font-family:megrim; line-height: normal"><br/> <a href="http://enattente.roleaddict.com/t18-devenir-super-potes" class="postlink" target="_blank" rel="nofollow">prêter serment</a> ✝ <a href="http://enattente.roleaddict.com/t20-registre-des-partenaires" class="postlink" target="_blank" rel="nofollow">galerie des armoiries</a></span></div></div></div> </td><td align="left"> <div style="padding: 15px;text-align: justify;text-shadow: khaki 3px 3px 3px; background-color:#000000;width: 260px; height: 180px;border: 5px solid #000000; "><div style="margin:auto;text-align:center;width:100%"><center><span style="font-size: 16pt;font-family:nothing you could do; letter-spacing:-2px;line-height: normal"><font color="#8E8331"><strong>voter pour régner</strong></font></span></center><br/> <a href="http://www.root-top.com/topsite/obsession27/in.php?ID=17277" class="postlink" target="_blank" rel="nofollow"><img src="http://icons.iconarchive.com/icons/iconshock/halloween/256/jack-icon.png" border="0" width="20px" alt="" /></a> <a href="http://www.root-top.com/topsite/homecomingtop/in.php?ID=133" class="postlink" target="_blank" rel="nofollow"><img src="http://icons.iconarchive.com/icons/iconshock/halloween/256/jack-icon.png" border="0" width="20px" alt="" /></a> <a href="http://www.root-top.com/topsite/zhiming/in.php?ID=1726" class="postlink" target="_blank" rel="nofollow"><img src="http://icons.iconarchive.com/icons/iconshock/halloween/256/jack-icon.png" border="0" width="20px" alt="" /></a> <br/> <a href="http://www.root-top.com/topsite/lilie/in.php?ID=6812" class="postlink" target="_blank" rel="nofollow"><img src="http://icons.iconarchive.com/icons/iconshock/halloween/256/jack-icon.png" border="0" width="20px" alt="" /></a> <a href="http://www.root-top.com/topsite/eliterpg/in.php?ID=799" class="postlink" target="_blank" rel="nofollow"><img src="http://icons.iconarchive.com/icons/iconshock/halloween/256/jack-icon.png" border="0" width="20px" alt="" /></a> <a href="http://www.root-top.com/topsite/twilightbloodsucker/in.php?ID=399" class="postlink" target="_blank" rel="nofollow"><img src="http://icons.iconarchive.com/icons/iconshock/halloween/256/jack-icon.png" border="0" width="20px" alt="" /></a><br/><br/><div align="center"><div style="height:120px; overflow:auto; padding-right: 10px;"><span style="font-size: 10px; font-family:megrim;;line-height: normal">Un vote toutes les heures n'a jamais tué personne !<br/><br/><br/> <font color=#8E8331> design by Phantasmagoria ce forum est l'entière propriété de lou, nom & nom</color></span></div></div></div> </td></tr></table></center>

Et voici le css correspondant :

Code:: /*STAFF PA*/ .tstaff{font-size:10px;} .thumbnail{position: relative; z-index: 0;} .thumbnail:hover{background-color: transparent;z-index: 50;} .thumbnail span{ position: absolute; background-color:#0f0601; padding: 5px; left: -1000px; visibility: hidden; color:khaki;} .thumbnail span img{border: 1px groove;padding: 2px;} .thumbnail:hover span{ visibility: visible; top: 15px; left: 25px; width: 160px;}