problème d'alignement pa

2 participants

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

Résolu problème d'alignement pa

Message par Loü Mer 29 Mai 2013 - 22:06

Bonsoir I love you

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;}

Merci d'avance Very Happy


Dernière édition par Loü le Mer 29 Mai 2013 - 22:38, édité 1 fois
Loü

Loü
***

Messages : 171
Inscrit(e) le : 28/01/2010

Loü a été remercié(e) par l'auteur de ce sujet.

Résolu Re: problème d'alignement pa

Message par Anzu Mer 29 Mai 2013 - 22:13


Bonsoir,

Normal, vous avez mis chaque membre du Staff dans un tr Rolling Eyes
Il faut qu'un seul tr, et trois td.
tr=ligne


Cordialement.
Anzu

Anzu
Membre actif

Féminin
Messages : 20685
Inscrit(e) le : 30/08/2007

https://forum.forumactif.com/
Anzu a été remercié(e) par l'auteur de ce sujet.

Résolu Re: problème d'alignement pa

Message par Loü Mer 29 Mai 2013 - 22:38

Merci, je ne savais pas, j'ai appris un truc Very Happy
Loü

Loü
***

Messages : 171
Inscrit(e) le : 28/01/2010

Loü 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