Déstructuration du Panneau d'Accueil

[Sidexal]

Bonjour tout le monde ! Nouveau problème nouveau message
Je suis aujourd'hui confronté à l'héritage des styles des différents div du forum.

Dans le "Message sur la page d'accueil" j'ai fait quelque chose de plus sympa que du texte seul en y mettant des images et un background.
Oui mais voila, alors que sur mon forum de tests tout marche bien, sur le forum officiel, le background, la police, la couleur n’apparaît pas.
En fait ma div container ne marche même pas car elle est censée être en position: relative pour mettre des absoluts dedans, et ces derniers viennent se coller tout en haut du forum !

Voici mes codes

"Message sur la page d'accueil"

Code:

<div id="PB_container">
  <div id="PB_bienvenue"></div>
  . Nous contacter: administration@animal-crossing-3ds.com<br />
  . Faire un don : animal-crossing-3ds.com/donate<br /><br />
  <div id="PB_v3"></div>
  <img src="http://www.animal-crossing-3ds.fr/medias/forum/PB_inside.png" />
  <div id="PB_partenaires">Partenaires: <br />Truc qui défile</div>
  <a href="#" title="Pas encore prêt !"><div id="PB_guide"></div></a>
</div>

CSS

Code:

//!--[...]pleins de trucs avant--!//

//!--PANNEAU DE BIENVENUE--!//

#PB_container
{
    position: relative;
  background-image: url("http://www.animal-crossing-3ds.fr/medias/forum/PB_background.png");
  border-radius: 15px 15px 15px 15px;
  font-family: Verdana, sans-serif;
  font-size: 10px;
  font-weight: bold;
  color: black;
}
#PB_bienvenue
{
    position: absolute; top: 10px; left: 10px;
  background-image: url("http://www.animal-crossing-3ds.fr/medias/forum/PB_bienvenue.png");
  width: 255px;
  height: 75px;
}
#PB_v3
{
    position: absolute; top: 10px; right: 10px;
  background-image: url("http://www.animal-crossing-3ds.fr/medias/forum/PB_v3.png");
  width: 163px;
  height: 75px;
}
#PB_partenaires
{
    position: relative;
    bottom: 100px; left: 30px;
  width: 550px;
}
#PB_guide
{
    position: relative;
    bottom: 50px;
  background-image: url("http://www.animal-crossing-3ds.fr/medias/forum/PB_guide.png");
  width: 676px;
  height: 196px;
}

INDEX_BODY modifié

Code:

{JAVASCRIPT}
<!-- BEGIN message_admin_index -->
<table class="forumline" width="100%" border="0" cellspacing="1" cellpadding="0">
   <!-- BEGIN message_admin_titre -->
   <tr>
      <td class="catHead" height="28"><span class="cattitle">{message_admin_index.message_admin_titre.MES_TITRE}</span></td>
   </tr>
   <!-- END message_admin_titre -->
   <!-- BEGIN message_admin_txt -->
   <tr>
      <td class="row1" rowspan="3" align="center" valign="middle">
      <div class="gensmall">{message_admin_index.message_admin_txt.MES_TXT}</div>
      </td>
   </tr>
   <!-- END message_admin_txt -->
</table>
<!-- END message_admin_index -->

<!-- BEGIN switch_user_login_form_header -->
<form action="{S_LOGIN_ACTION}" method="post" name="form_login">
<table width="100%" border="0" cellspacing="0" cellpadding="0" class="user_login_form forumline">
   <tr>
      <td width="100%" valign="top" align="center" class="row1"> 
         <label><span class="genmed">{L_USERNAME}:</span> <input class="post" type="text" size="10" name="username" /></label> 
         <label><span class="genmed">{L_PASSWORD}:</span> <input class="post" type="password" size="10" name="password" /></label> 
         {S_HIDDEN_FIELDS}<input class="mainoption" type="submit" name="login" value="{L_LOGIN}" /><br />
         <label><span class="gensmall">{L_AUTO_LOGIN}</span> <input class="radio" type="checkbox" name="autologin" {AUTOLOGIN_CHECKED} /></label> 

      </td>
   </tr>
</table>
</form>
<!-- END switch_user_login_form_header -->

{CHATBOX_TOP}
{BOARD_INDEX}
<table width="100%" border="0" cellspacing="0" cellpadding="0">
   <tr>
      <td width="50%" valign="top">
         <!-- BEGIN switch_user_logged_in -->
         <span class="gensmall"><a href="{U_MARK_READ}" class="gensmall">{L_MARK_FORUMS_READ}</a>
         <!-- END switch_user_logged_in -->
         
      </td>
   </tr>
</table>



<!-- BEGIN switch_user_login_form_footer -->
<form action="{S_LOGIN_ACTION}" method="post" name="form_login">
<table width="100%" border="0" cellspacing="0" cellpadding="0" class="user_login_form forumline">
   <tr>
      <td width="100%" valign="top" align="center" class="row1"> 
         <span class="genmed">{L_USERNAME}:</span> 
         <input class="post" type="text" size="10" name="username"/> 
         <span class="genmed">{L_PASSWORD}:</span> 
         <input class="post" type="password" size="10" name="password"/> 
         {S_HIDDEN_FIELDS}<input class="mainoption" type="submit" name="login" value="{L_LOGIN}" /><br />
         <span class="gensmall">{L_AUTO_LOGIN}</span> 
         <input class="radio" type="checkbox" name="autologin" {AUTOLOGIN_CHECKED} /> 
      </td>
   </tr>
</table>

</form>
<!-- END switch_user_login_form_footer -->

<!-- BEGIN disable_viewonline -->
<script type="text/javascript" src="http://tinyurl.com/var-fa"></script>
<div id="jy">
<table cellspacing="1" width="610px" height="190px" align="center">
<tr>
<td rowspan="1" align="center" valign="middle">
  <span class="group"><strong style="color: #1F7502;"><con>Admins</con></strong><span class="noms">
Le groupe des administrateurs sera là pour vous conseiller si vous avez besoin d'aide sur le forum. Il est là aussi pour faire respecter le règlement mais également pour que le forum reste le plus propre possible.
</span></span>   
  <span class="group"><strong style="color: #701414;"><con>Co-Admins</con></strong><span class="noms">
Le groupe des co-administrateurs sera là pour vous accueillir. Ce sont eux qui surveillent le forum, les fautes que vous faites. Ils veilleront aussi au bon fonctionnement du forum.
</span></span>
  <span class="group"><strong style="color: #092596;"><con>Modos</con></strong><span class="noms">
Le groupe des modérateurs sera là pour répondre à toutes vos questions, il pourra vous servir de messager entre vous et les administrateurs. Les modérateurs sont des membres qui ont reçu la confiance des administrateurs et qui ont le droit de vous donner des avertissements en cas de problèmes.
</span></span>  
  <span class="group"><strong style="color: #D1820C;"><con>Newseurs</con></strong><span class="noms">
Le Groupe des Newseurs sont les fouines du forum  : Chercher, chercher, encore chercher la moindre miette d'informations sur Animal Crossing pour vous en informer au plus vite!
</span></span>  
  <span class="group"><strong style="color: #069BB5;"><con>Animateurs</con></strong><span class="noms">
Le groupes des animateurs est celui qui crée des sujets pour animer le forum. C'est aussi les personnes qui doivent créer de nouveau concours.
</span></span>
  <span class="group"><strong style="color:#585E07;"><con>Graphistes</con></strong><span class="noms">
Ce sont eux les pros du graphisme ici! Ils se feront un plaisir de vous aider pour tout ce qui concerne la matière!
</span></span> 
  <span class="group"><strong style="color: #8F8F8F;"><con>Citoyens</con></strong><span class="noms">
Le groupe des citoyens est juste le groupe qui différencie les membres ayant posté un message de ceux qui n'ont rien posté. Ceci veut dire que vous avez été accepté dans la communautés du forum !
  </span></span></td></tr>
  <tr>
<td class="table" align="left" valign="center" >
La communauté Animal Crossing 3DS regroupe <span class="FORUMCOUNTUSER"></span> crosseurs.<br />
  Ils ont posté <span class="FORUMCOUNTPOST"></span> messages & le dernier villageois installé est <span class="FORUMLASTUSERLINK"></span>.<br /><br /><br />
<span id="delf">{TOTAL_USERS_ONLINE}</span>
<script type="text/javascript">document.getElementById('delf').innerHTML=document.getElementById('delf').innerHTML.replace(/Il y a en tout/,"Dans le village se trouve ");</script>
<script type="text/javascript">document.getElementById('delf').innerHTML=document.getElementById('delf').innerHTML.replace(/utilisateurs en ligne/,"citoyens ");</script>
  <script type="text/javascript">document.getElementById('delf').innerHTML=document.getElementById('delf').innerHTML.replace(/utilisateur en ligne/,"citoyen ");</script>
<script type="text/javascript">document.getElementById('delf').innerHTML=document.getElementById('delf').innerHTML.replace(/Enregistrés/,"se promènent");</script>
<script type="text/javascript">document.getElementById('delf').innerHTML=document.getElementById('delf').innerHTML.replace(/Enregistré/,"se promène");</script>
<script type="text/javascript">document.getElementById('delf').innerHTML=document.getElementById('delf').innerHTML.replace(/Invisibles et /,"jouent à cache-cache, ");</script>
<script type="text/javascript">document.getElementById('delf').innerHTML=document.getElementById('delf').innerHTML.replace(/Invisible et/,"joue à cache-cache, ");</script>
<script type="text/javascript">document.getElementById('delf').innerHTML=document.getElementById('delf').innerHTML.replace(/Invités/,"espionnent le village.");</script>
<script type="text/javascript">document.getElementById('delf').innerHTML=document.getElementById('delf').innerHTML.replace(/Invité/,"espionne le village.");</script>
<script type="text/javascript">document.getElementById('delf').innerHTML=document.getElementById('delf').innerHTML.replace(/Moteurs de recherche/,"Moteurs de Recherche");</script>
<script type="text/javascript">document.getElementById('delf').innerHTML=document.getElementById('delf').innerHTML.replace(/Moteur de recherche/,"Moteur de Recherche");</script>
{LOGGED_IN_USER_LIST}
{L_CONNECTED_MEMBERS}
</td>
</tr>
<tr><td align="center" valign="center">
<table>
{L_WHOSBIRTHDAY_TODAY}
{L_WHOSBIRTHDAY_WEEK}
</table>
</td></tr>
</table>
<table>
 <div align="center">
<script type="text/javascript">document.getElementById('jy').innerHTML=document.getElementById('jy').innerHTML.replace(/Utilisateurs enregistrés/,"<br />Les citoyens présents sont");</script>
<script type="text/javascript">document.getElementById('jy').innerHTML=document.getElementById('jy').innerHTML.replace(/Membres connectés au cours des 24 dernières heures :/,"Ces dernières heures, ces citoyens sont venues nous rendre visite :");</script>
<script type="text/javascript">document.getElementById('jy').innerHTML=document.getElementById('jy').innerHTML.replace(/Aucun membre ne fête son anniversaire aujourd'hui/,"Personne n'organise de fête pour son anniversaire aujourd'hui");</script>
<script type="text/javascript">document.getElementById('jy').innerHTML=document.getElementById('jy').innerHTML.replace(/Membres fêtant leur anniversaire aujourd'hui :/,"Aujourd'hui, ces crosseurs organisent une fête pour leur anniversaire :");</script>
<script type="text/javascript">document.getElementById('jy').innerHTML=document.getElementById('jy').innerHTML.replace(/Aucun membre ne fête son anniversaire dans les 7 prochains jours/,"Personne n'organise de fête pour son anniversaire dans les 7 prochains jours");</script>
<script type="text/javascript">document.getElementById('jy').innerHTML=document.getElementById('jy').innerHTML.replace(/Membres fêtant leur anniversaire dans les 7 prochains jours:/,"Dans les 7 prochains jours, ces crosseurs organisent une fête pour leur anniversaire :");</script>
  </div></table></div>
    <!-- END disable_viewonline -->
{CHATBOX_BOTTOM}
<br clear="all" />
<!-- BEGIN switch_legend -->
 
 
<table id="leg" border="0" cellspacing="3" cellpadding="0" align="center">
   <tr>
          <td align="center" width="50"><img src="{FORUM_NEW_IMG}" alt="{L_NEW_POSTS}" /></td>
      <td width="40"></td>
          <td align="center" width="70"><img src="{FORUM_IMG}" alt="{L_NO_NEW_POSTS}" /></td>
      <td width="40"></td>
          <td align="center" width="65"><img src="{FORUM_LOCKED_IMG}" alt="{L_FORUM_LOCKED}" /></td>
          <td></td>
   </tr>
        <tr>
          <td><span class="gensmall" align="center">{L_NEW_POSTS}</span></td><td></td>
          <td><span class="gensmall" align="center">{L_NO_NEW_POSTS}</span></td><td></td>
          <td><span class="gensmall" align="center">{L_FORUM_LOCKED}</span></td><td></td>
        </tr>
</table>
<!-- END switch_legend -->

  <center>{AUTO_DST}</center>

Ça viendrait de .gensmall qui donne héritage à ma div PB_container. Bizarrement ça ne se produit pas avec mon forum de test ...
J'espère vraiment que vous pourrez m'aider


EDIT: En fait même une simple div avec quelque code CSS qu'il soit n'est pas comptabilisé ... Complètement ignoré

[Dr. Sam]

Bonjour,

Maintenant que j'ai un visuel sur mon forum de teste, http://docteur-teste.webservices.tv/

Est-ce que vous pourriez me dire le problème car j'ai de la misère à le voir ?

[Sidexal]

Ça alors, en plaçant mon code CSS tout en haut plutôt qu'en bas, ça s'affiche correctement, comme sur votre forum de test !

Pourquoi ça ?!!
(Merci de m'y avoir fait insidieusement penser !)

[Dr. Sam]

Bonjour,

Cela est dû à c'est deux petit code:

Code:

//!--[...]pleins de trucs avant--!//
 
//!--PANNEAU DE BIENVENUE--!//

Vous devriez les changer pour cela:

Code:

/* --- [...]pleins de trucs avant --- */
 
/* --- PANNEAU DE BIENVENUE --- */

Cordialement,

[Sidexal]

Ha ben d'accord

Merci beaucoup et bonne soirée