N°1 PA simple et organisé sur 4 niveaux

PA sur 4 étages

Ce qui est bien avec la réorganisation du forum, c'est que dorénavant tous les codages ont été testé de nouveau, et vous n'êtes plus dans l'obligation de remercier pour obtenir l'un des deux codes. Mais un merci est toujours apprécié malgré tout. Wink

N'hésitez pas à cliquer sur les images en miniatures pour avoir l'aperçu de la PA.

Laxy.

codage by Laxy Dunbar

Visuel de la PA :

N°1 PA simple et organisé sur 4 niveaux Pas110

N°1 PA simple et organisé sur 4 niveaux Pas210

N°1 PA simple et organisé sur 4 niveaux Pas310

N°1 PA simple et organisé sur 4 niveaux Pas410

HTML :

Code:: <div align="center">

<div style="width:800px;height:672px;background-color:transparent;">

<div style="font-family: Campus relief, georgia; font-weight: bold; font-size: 25px; letter-spacing: 7px; text-transform: uppercase; text-shadow: 0px 0px 6px #444444; ">
<span style="color: #182F41;">Welcome {USERNAME} to NYC!</span>
</div>
<br />
<center>

<div style="font-family: georgia; font-weight: bold; font-size: 15px; letter-spacing: 7px; text-shadow: 0px 0px 6px #444444; ">
<span style="color: #182F41;">Contexte de FIA & Vidéo de FIA & Les liens rapides </span>
</div>

</center><br />
<table>

<tbody>

<tr>

<td>

<div style="width:200px;height:150px; background-color:#E9E8E7; overflow:auto">

<div align="justify">
S'offrir le luxe d'acheter sans compter, avoir sa tête en première page de magazines, être très demandé, voilà qui fait rêver bon nombres d'entres nous. Encore faut-il réellement savoir ce que nous voulons devenir et dans quel domaine exercer: le mannequinat, la musique, la cinématographie? Quoi que le métier du mannequinat reste le plus tentant de tous si on n'évite de penser aux préjugés et ainsi croire les ragots qui s'en rapporte. <a href="http://ifeltitallrpg.forumactif.org/t4-le-contexte" class="postlink">Lire la suite</a>
</div>

</div>

</td>

<td>
<iframe src="http://www.youtube.com/embed/UqG0ITXID9w?autohide=0&theme=light&modestbranding=1&rel=0&wmode=transparent&autoplay=0" frameborder="no" style="width: 300px; height: 150px;"> </iframe>
</td>

<td>

<div style="width:200px;height:150px; background-color:#E9E8E7; overflow:auto">
<br /> ✦ <a href="http://ifeltitallrpg.forumactif.org/t5-la-charte" class="postlink">Charte</a><br />✦ <a href="http://ifeltitallrpg.forumactif.org/t1-bottin-d-avatars" class="postlink">Bottin</a><br />✦ <a href="http://ifeltitallrpg.forumactif.org/f53-devenir-partenaire" class="postlink">Partenariat ?</a><br />✦ <a href="http://ifeltitallrpg.forumactif.org/f7-les-post-vacants" class="postlink">Scénarios</a> <br /><br /><span style="color: #ff0000;">Survolez chaque image pour y dévoiler un texte ou un pseudo !</span>
</div>

</td>

</tr>

</tbody>

</table>
<br />
<center>

<div style="font-family: georgia; font-weight: bold; font-size: 15px; letter-spacing: 7px; text-shadow: 0px 0px 6px #444444; ">
<span style="color: #182F41;">Dans chaque groupes nous avons :</span>
</div>

<table>

<tbody>

<tr>

<td>

<div class="cate">
<img src="http://www.musiqueradio.com/photos/titres/2015/selenagomez.meandtheryhthm.jpg" class="cate_img" />
<div class="cate_description">
00 Membres
</div>

</div>

</td>

<td>

<div class="cate">
<img src="http://lh5.ggpht.com/2t1X5uNHCrDhBFLGpiybvgRAHaDlZ2NdF1P1Ma3_QQYkF2j_tmzwVyHGK2HVtKz7Rig=w100" class="cate_img" />
<div class="cate_description">
00 Membres
</div>

</div>

</td>

</tr>

</tbody>

</table>
<br />
<center>

<div style="font-family: georgia; font-weight: bold; font-size: 15px; letter-spacing: 7px; text-shadow: 0px 0px 6px #444444; ">
<span style="color: #182F41;">Membre du staff & Les crédits & Membre du mois </span>
</div>

</center><br />
<table>

<tbody>

<tr>

<td>

<div class="staff">
<img src="http://i86.servimg.com/u/f86/18/95/70/35/bklece12.jpg" class="staff_img" />
<div class="staff_description">
Fondateur / Fondatrice <a rel="nofollow" target="_blank" class="postlink" href="VOTRE URL ICI">PSEUDO</a>
</div>

</div>

</td>

<td>

<div class="staff">
<img src="http://i86.servimg.com/u/f86/18/95/70/35/aclece12.jpg" class="staff_img" />
<div class="staff_description">
Modérateur / Modératrice <a rel="nofollow" target="_blank" class="postlink" href="VOTRE URL ICI">PSEUDO</a>
</div>

</div>

</td>

<td>

<div style="width:300px;height:120px; background-color:#E9E8E7; overflow:auto">
<br /> ✦ Codage QEEL par <a rel="nofollow" target="_blank" class="postlink" href="VOTRE URL ICI">PSEUDO</a> <br /> ✦ Codage des catégories par <a href="VOTRE URL ICI">PSEUDO</a> <br /> ✦ Codage PA par <a href="http://lecerclesecret.forumactif.org/">Laxy Dunbar</a> <br /> ✦ Design par <a href="VOTRE URL ICI">PSEUDO</a>
</div>

</td>

<td>

<div class="membre">
<img src="http://i86.servimg.com/u/f86/18/95/70/35/acmemb10.jpg" class="membre_img" />
<div class="membre_description">
Félicitation à <a rel="nofollow" target="_blank" class="postlink" href="VOTRE URL ICI">PSEUDO</a> qui est notre merveilleux membre du mois !
</div>

</div>

</td>

</tr>

</tbody>

</table>
<br />
<center>

<div style="font-family: georgia; font-weight: bold; font-size: 15px; letter-spacing: 7px; text-shadow: 0px 0px 6px #444444; ">
<span style="color: #182F41;">Nos top-partenaires :</span>
</div>

</center><br /> <a target="_blank" href="URL DU FORUM ICI"><img src="http://i86.servimg.com/u/f86/18/95/70/35/parten10.jpg" class="imagepa" /></a> <a target="_blank" href="URL DU FORUM ICI"><img src="http://i86.servimg.com/u/f86/18/95/70/35/parten10.jpg" class="imagepa" /></a> <a target="_blank" href="URL DU FORUM ICI"><img src="http://i86.servimg.com/u/f86/18/95/70/35/parten10.jpg" class="imagepa" /></a> <a target="_blank" href="URL DU FORUM ICI"><img src="http://i86.servimg.com/u/f86/18/95/70/35/parten10.jpg" class="imagepa" /></a></br><a target="_blank" href="URL DU FORUM ICI"><img src="http://i86.servimg.com/u/f86/18/95/70/35/parten10.jpg" class="imagepa" /></a> <a target="_blank" href="URL DU FORUM ICI"><img src="http://i86.servimg.com/u/f86/18/95/70/35/parten10.jpg" class="imagepa" /></a> <a target="_blank" href="URL DU FORUM ICI"><img src="http://i86.servimg.com/u/f86/18/95/70/35/parten10.jpg" class="imagepa" /></a> <a target="_blank" href="URL DU FORUM ICI"><img src="http://i86.servimg.com/u/f86/18/95/70/35/parten10.jpg" class="imagepa" /></a>
</center>

</div>
</div>

Pour le code HTML allez dans Panneau d'admin -> Affichage -> Page d'accueil -> Généralité

CODE CSS :

Code:: /*MINI PA BY LAXY*/
.cate {
width: 100px;
height: 100px;
overflow: hidden;
position: relative;
}
.cate_description {
width:100px;
height:100px;
padding: 5px;
overflow: auto;
}
.cate_img {
position: absolute;
min-width: 100px;
min-height: 100px;
top: 0;
left: 0;
-moz-transition: all 1s ease-out;
-o-transition: all 1s ease-out;
-htm-transition: all 1s ease-out;
-webkit-transition: all 1s ease-out;
transition: all 1s ease-out;
}

.cate:hover .cate_img {
left: 100%;
}

.staff {
width: 85px;
height: 85px;
overflow: hidden;
position: relative;
}
.staff_description {
width:85px;
height:85px;
padding: 5px;
overflow: auto;
}
.staff_img {
position: absolute;
min-width: 85px;
min-height: 85px;
top: 0;
left: 0;
-moz-transition: all 1s ease-out;
-o-transition: all 1s ease-out;
-htm-transition: all 1s ease-out;
-webkit-transition: all 1s ease-out;
transition: all 1s ease-out;
}

.staff:hover .staff_img {
left: 100%;
}

.membre {
width: 200px;
height: 120px;
overflow: hidden;
position: relative;
}
.membre_description {
width:200px;
height:120px;
padding: 5px;
overflow: auto;
}
.membre_img {
position: absolute;
min-width: 200px;
min-height: 120px;
top: 0;
left: 0;
-moz-transition: all 1s ease-out;
-o-transition: all 1s ease-out;
-htm-transition: all 1s ease-out;
-webkit-transition: all 1s ease-out;
transition: all 1s ease-out;
}

.membre:hover .membre_img {
left: 100%;
}
/*FIN MINI PA by Laxy*/

Pour le CSS allez dans panneau d'admin -> Affichage -> Couleur -> Feuille de style CSS et collez-y le code CSS