blouuuuuup.

code page d’accueil > généralité:

Code:: <div style="margin:auto;text-align:center;width:100%">
<span class="titr">the pursuit of happiness</span>
</div>

<table>

<tbody>

<tr>

<td style="width: 70%;">

<div class="q3">

<div align="right">
<span class="imp"> votre bonheur est à porté de mains... xoxo </span>
</div>
« Bonheur : un mot fragile, évanescent, léger, surtout. » Pour vous, qu’est-ce que le bonheur ? Un nom que tout le monde connaît mais que tout le monde a dû mal à définir, et à atteindre. Quoiqu’il en soit, personne ne sera jamais d’accord sur ce terme mystérieux. Pour certains, le bonheur est souvent conçu comme étant une fin ultime de la vie humaine. Pour trouver le bonheur devons-nous donc mourir ? Mais, alors qu'est-ce que ressent une femme quand elle met au monde son enfant ? Cette sensation de réussite, de satisfaction d'avoir donnée la vie. Ou alors comment se sent un jeune homme qui pour la première fois embrasse sa bien aimée ? N'est-ce pas un signe de la présence du bonheur ? <strong> <a href="http://www.pursuit-of-happiness.net/t4543-once-upon-a-time-le-contexte">lire la suite ?</a></strong><br />
</div>

</td>

<td style="width: 30%;">

<div class="q3">

<div class="gensmall">
<script type="text/javascript">
   function patonglet1() { document.getElementById('onglet1').style.display='block'; document.getElementById('onglet2').style.display='none';
   document.getElementById('onglet3').style.display='none'; document.getElementById('onglet4').style.display='none'; }

   function patonglet2() { document.getElementById('onglet1').style.display='none'; document.getElementById('onglet2').style.display='block';
   document.getElementById('onglet3').style.display='none'; document.getElementById('onglet4').style.display='none';}

   function patonglet3() { document.getElementById('onglet1').style.display='none'; document.getElementById('onglet2').style.display='none';
   document.getElementById('onglet3').style.display='block'; document.getElementById('onglet4').style.display='none';}

   function patonglet4() { document.getElementById('onglet1').style.display='none'; document.getElementById('onglet2').style.display='none';
   document.getElementById('onglet3').style.display='none'; document.getElementById('onglet4').style.display='block';}</script>

<center>

<table style="width: 100%;">

<tbody>

<tr>

<td style="width: 25%;">

<div onmouseover="javascript:patonglet1()" class="onglet">

<center>
<img class="cadre" src="http://img11.hostingpics.net/pics/202244lera.jpg" />
<center>

</center>

</center>

</div>

</td>

<td style="width: 25%;">

<div onmouseover="javascript:patonglet2()" class="onglet">

<center>
<img class="cadre" "="" src="http://img11.hostingpics.net/pics/478235sierra.jpg" />
</center>

</div>

</td>

<td style="width: 25%;">

<div onmouseover="javascript:patonglet3()" class="onglet">

<center>
<img class="cadre" src="http://img11.hostingpics.net/pics/766028julie.jpg" />
<center>

</center>

</center>

</div>

</td>

<td style="width: 25%;">

<div onmouseover="javascript:patonglet4()" class="onglet">

<center>
<img class="cadre" src="http://img11.hostingpics.net/pics/641763camil.jpg" />
<center>

</center>

</center>

</div>

</td>

</tr>

</tbody>

</table>

</center>

<table style="width: 100%;">

<tbody>

<tr style="width: 100%;">

<td style="width: 100%;">


<div style="display: none;" id="onglet1">
<span class="q4"> </span>
<div style="margin: auto; text-align: center; width: 100%;">
<span class="titr3">lera-ann vilte</span><br /><span class="imp">administratrice</span><br /><a href="http://www.pursuit-of-happiness.net/privmsg?mode=post&u=766"><strong> harcèle moi </strong></a> ∞ <a href="http://www.pursuit-of-happiness.net/u766"><strong> voir mon profil</strong></a>
</div><span class="q4"></span>
</div>


<div style="display: none;" id="onglet2">
<span class="q4"> </span>
<div style="margin: auto; text-align: center; width: 100%;">
<span class="titr3">sierra desrosiers</span><br /><span class="imp">administratrice</span><br /><a href="http://www.pursuit-of-happiness.net/privmsg?mode=post&u=200"><strong> harcèle moi </strong></a> ∞ <a href="http://www.pursuit-of-happiness.net/u200"><strong> voir mon profil</strong></a>
</div><span class="q4"></span>
</div>

<div style="display: none;" id="onglet3">
<span class="q4"> </span>
<div style="margin: auto; text-align: center; width: 100%;">
<span class="titr3">julie evans</span><br /><span class="imp">administratrice</span><br /><a href="http://www.pursuit-of-happiness.net/privmsg?mode=post&u=504"><strong> harcèle moi </strong></a> ∞ <a href="http://www.pursuit-of-happiness.net/u504"><strong> voir mon profil</strong></a>
</div><span class="q4"></span>
</div>

<div style="display: none;" id="onglet4">
<span class="q4"> </span>
<div style="margin: auto; text-align: center; width: 100%;">
<span class="titr3">camil marshall</span><br /><span class="imp">modératrice</span><br /><a href="http://www.pursuit-of-happiness.net/privmsg?mode=post&u=956"><strong> harcèle moi </strong></a> ∞ <a href="http://www.pursuit-of-happiness.net/u956"><strong> voir mon profil</strong></a>
</div><span class="q4"></span>
</div>

</td>

</tr>

</tbody>

</table>

</div>

</div>

</td>

</tr>

</tbody>
</table>

<table>

<tbody>

<tr>

<td style="width: 30%;">
<span class="q3"> </span>
<div style="margin: auto; text-align: center; width: 100%;">
<img class="cadre2" src="http://image.noelshack.com/fichiers/2013/08/1361207408-icon.png" /> <img class="cadre2" src="http://image.noelshack.com/fichiers/2013/08/1361207408-icon.png" /> <img class="cadre2" src="http://image.noelshack.com/fichiers/2013/08/1361207408-icon.png" /> <img class="cadre2" src="http://image.noelshack.com/fichiers/2013/08/1361207408-icon.png" /> <br /> <img class="cadre2" src="http://s4.noelshack.com/uploads/images/1488688046307_blue7.png" /> <img class="cadre2" src="http://s4.noelshack.com/uploads/images/1488688046307_blue7.png" /> <img class="cadre2" src="http://s4.noelshack.com/uploads/images/1488688046307_blue7.png" /> <img class="cadre2" src="http://s4.noelshack.com/uploads/images/1488688046307_blue7.png" /><br />
<div align="justify">
On félicite bien fort nos membres du mois qui sont les joueuses de : <strong>Gaïa Leibowitz</strong> et <strong>Rome Angst</strong>. Jette aussi un coup d'œil chez <a href="http://www.pursuit-of-happiness.net/f199-les-roles"> nos petits scénarios</a>.
</div>

</div><span class="q3"></span>
</td>

<td style="width: 40%;">
<span class="q3"><span class="titr2">News</span><br /><br /><span class="imp"><strong> 06/01/2011 </strong>le forum a ouvert ses portes le 06 janvier 2011 et ne demande pas de minimum de lignes. Il est optimisé pour mozilla firefox et est l'entière propriété des fondatrices.<strong> 02/06/2014 </strong>Nouveau design printanier par Nevada.Stick<strong> 02/06/2014 </strong>Rappelez vous que les points d'activités sont là pour vous nominer membres du mois, et ainsi recevoir vos cadeaux de remerciements. Compteur remis à zéro guys </span> bienvenue sur le forum mon petit. </span>
</td>

<td style="width: 30%;">
<span class="q3"><br /></span>
<center>
<span class="imp">nos amis </span><br /><a href="http://www.your-family-tree.net/">▲</a> <a href="http://stjohnswood.weshforum.com/">▲</a> ▲ ▲ <br /> ▲ ▲ ▲ ▲ <br />
<div align="justify">
le forum est administré par <span class="imp"> maya, june, mel et nevada.stick</span>. le contexte a été rédigé par <span class="imp">POH</span>. le header a été crée par <span class="imp">nevada.stick</span>. le codage du forum a été réalisé par <span class="imp">ito sur bazzart</span>. © 2013-2014
</div>

</center><span class="q3"></span>
</td>

</tr>

</tbody>
</table>

code page d'accueil CSS:

Code:: /* PAGE D'ACCUEIL PAR CRUSH */

   .titr {
  font-family: Codystar;
  font-weight: bold;
  font-size: 55px;
  letter-spacing: -3pt;
  text-transform: lowercase;
  text-shadow: 0px 0px 1px;
  text-align: center;
  line-height: 16px;
  color:#c6687b;
   }

   .titr2 {
   font-family: Times New Roman; line-height: 16px;text-transform: lowercase;
   letter-spacing: -3px;
   font-style: italic;
   text-align: center;
   font-size: 50px;
   color: #c6687b; }

   .titr2:hover {
   color:indianred; }

   .imp {
   text-transform: lowercase;
   letter-spacing: -1.5px;
   color: #3d5158;}

   .q3 {
   display: block;
   background-image: url(http://s4.noelshack.com/old/up/image_8-813a2f2426.png);
   border: 1px solid gainsboro;
   text-align:justify;
   padding:1px;
   height: 125px;}

   .cadre {
   width: 50px;
   height: 50px;
   padding: 2px;
   border: 1px solid gainsboro;
   background-color: white; }

   .cadre2 {
   width: 25px;
   height: 25px;
   padding: 2px;
   border: 1px solid gainsboro;
   background-color: white; }

   .q4 {
   display: block;
   background-color: #f7f6f1;
   border-left: 3px solid #f4a082;
   border-right: 3px solid #f4a082;
   text-align:justify;
   padding:1px;
   height: 50px; }

   .titr3 {
  font-family: Codystar;
  font-weight: bold;
  font-size: 25px;
  letter-spacing: -1.5pt;
  text-transform: lowercase;
  text-shadow: 0px 0px 1px;
  text-align: center;
  line-height: 16px;
  color:#f4a082;
   }

/*INFOBULLE*/
a.infobulle {
  position: relative;
}

a.infobulle span {
  display: none; /* ceci masque l'infobulle */
}
a.infobulle:hover {
  background: none; /* correction d'un bug IE */
  z-index: 999; /* on définit une valeur pour l'ordre d'affichage */

}
a.infobulle:hover span {
  display: inline; /* ceci affiche l'infobulle */
  position: absolute;
  -moz-border-radius: 10px;
  -webkit-border-radius: 10px;
  border-radius: 10px;

  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: -50px; /* on positionne notre infobulle */
  left: -5px;

  background: #fff5e4; /* arrière-plan de l'infobulle */

  color: #807166; /* texte dans l'infobulle */
  padding: 8px;

  /* bordures de votre infobulle*/
  border: 1px solid #493d3e;
}

code ancienne PA > index_body

Code:: <center><div class="cadrequeel"><div class="qeeltitre" style="margin-top:-20px">who's in san francisco ?</div><br><center><table><tr><td><div class="cadrequeel3"><br><br><div class="cadrecolorecategorie" style="text-align:center;"><table border="0" cellspacing="3" cellpadding="0" align="center" style="text-align: justify; font-size: 8px;">{L_CONNECTED_MEMBERS}</div></table> </div></div></center></div></div></center></div></div></td><td><div class="cadrequeel3">
<div style="width:300px;height:200px;overflow:none;"><br><br>Bienvenue sur <b>THE PURSUIT OF HAPPINESS</b>!
<span id="messages">{TOTAL_POSTS}</span>.
<span id="users">{TOTAL_USERS}</span>.

<span id="newuser">{NEWEST_USER}</span>. Nous lui souhaitons la bienvenue! <br><br>

<span id="totaluser">{TOTAL_USERS_ONLINE}</span>.

<div style="height:35px; overflow:auto;"><span id="connecteduser">{LOGGED_IN_USER_LIST}</span></span>
</div></div></div></td></tr></table><br>

<div class="cadrecolorecategorie" style="text-align:center;"><a href="http://www.pursuit-of-happiness.net/g19-friendship?tt=1"><span style="font-size: 17px; color: #FC7E2A; line-height: normal;"><font face="ms mincho">❝ FRIENDSHIP </font></span></a>
<a href="http://www.pursuit-of-happiness.net/g18-love?tt=1"><span style="font-size: 17px; color: #E66A97; line-height: normal;"> <font face="ms mincho">❝ LOVE </font></span></a>
<a href="http://www.pursuit-of-happiness.net/g22-money?tt=1"><span style="font-size: 17px; color: #7CC221; line-height: normal;"><font face="ms mincho">❝ MONEY </font></span> </a>
<a href="http://www.pursuit-of-happiness.net/g23-success?tt=1"><span style="font-size: 17px; color: #A68882; line-height: normal;"><font face="ms mincho">❝ SUCESS </font></span></a>
<a href="http://www.pursuit-of-happiness.net/g20-family?tt=1"><span style="font-size: 17px; color: #4EA4CC; line-height: normal;"><font face="ms mincho">❝ FAMILY </font></span></a>
<a href="http://www.pursuit-of-happiness.net/g21-sex?tt=1"><span style="font-size: 17px; color: #C21B29; line-height: normal;"><font face="ms mincho">❝ SEX </font></span></a></div><br></div>