Les bandes en bleu et footer

[L'ange noir]

Détails techniques

Version du forum : phpBB2
Poste occupé : Administrateur
Navigateur(s) concerné(s) : Google Chrome
Personnes concernées par le problème : Tous les utilisateurs
Lien du forum : http://sangsmelesoriginels.forumactif.com/

Description du problème

Bonjour

J'ai suivi le tuto de forumactif pour personnaliser la CM de mon forum. Tout s'est très bien passé. Pour mieux comprendre, j'ai mis des couleurs, dont celle du header en bleu. Mais voilà, cela a aussi changé en bleu les bandes au dessus et en dessous des posts.

Je vous montre




Je n'arrive pas à trouver comment retirer cette couleur bleu de cette partie.

Voici mon code CSS dans la feuille de style :

Code:

/* GENERAL */
body
{
background-image: url(https://img15.hostingpics.net/pics/935376fond.jpg) no-repeat; /* motif du fond de page */
background-attachement: fixed;
}

a:link, a:hover
{
  text-decoration : none !important;
}
.bodylinewidth
{
  position: relative;
  z-index: 3;
}

#page-body /* mise en forme du corps de page */
{
  width: 950px;
  background: url(https://img15.hostingpics.net/pics/155243463.jpg);
  border-top: 5px solid #d4a450;
  border-bottom: 5px solid #d4a450;
  border-right: 4px solid #d4a450;
  border-left: 4px solid #d4a450;
  box-shadow: 0px 0px 10px #000000;
}

a.mainmenu
{
  font-family: 'Alegreya Sans SC', sans-serif;
  letter-spacing: 2px;
}

.maintitle
{
  position: absolute;
  z-index: 4;
  width: 100%;
  height: 307px;
  background: url(https://img4.hostingpics.net/pics/120543258267ecriture1.png) center center no-repeat; /* image du titre */
  top: 0;
  left: 0;
  margin-top: 315px;
}

.forumline /* mise en forme des blocs et tables par defaut du forum */
{
  width: 98%;
  margin: auto;
  background: #e8e8e6;
  border: 1px solid #ffffff;
  margin: 10px auto;
}

.table
{
  width: 98%;
  margin: auto;
}

/* CATEGORIES */

/* Mise en forme du "bloc" qui contient le titre */
.TitreCategorie {
  background: #610B0B; /*fond*/
  /* Des coins arrondis */
  border-radius:50px 50px 0 0;
  -moz-border-radius:50px 50px 0 0;
  -wekbit-border-radius:50px 50px 0 0;
  width: 320px; /*largeur à modifier selon vos goûts*/
  margin-left: 297px; /* on centre le bloc */
  padding:2px; /*espace entre la bordure et le texte*/
  border:1px solid #C49E20;
  border-bottom:0px; 
}

/* mise en forme du titre lui-même */
.TitreCategorie h2 {
  margin:0; /* le titre a des marges par défaut, pour éviter de 'casser' nos réglages, on remet à zéro ici */
  text-align: center; /*alignement du texte par rapport au bloc qui le contient */
  letter-spacing:2px; /* espacement entre les lettres */
  color:#C49E20; /* couleur du texte */
  font-family: Nuncio, Geneva, Tahoma, Verdana, sans-serif;
  font-size:23px;
  font-weight : bold;
}

.forum /*cadre du forum sous titre catégorie*/
{ border-radius:30px 30px 0 0;
  -moz-border-radius:30px 30px 0 0;
  -wekbit-border-radius:30px 30px 0 0;
  border: 2px solid #9B6F1B;
  height: 150px;
  width: 54%;
  margin-bottom: 10px;
  margin-left: 200px;
}

.forum_titre /*comme Le Grimoire sacré*/
{ margin: 15px 0 0 24px;
  margin-left: 25px;
  position: absolute;
}

.forum:nth-child(2n+1) .description {
    margin-left: 0;
}
.forum:nth-child(2n+1) .description_texte {
    margin-left: 265px;
}
.forum:nth-child(2n+1) .block {
    margin-left: 250px;
}
.forum:nth-child(2n+1) .forum_titre {
    margin-left: 250px;
}
 
.forum_titre a
{
  display: block;
  font-family: 'Alegreya Sans SC', sans-serif;
  font-size: 15px;
  letter-spacing: 2px;
  font-weight: normal;
  text-shadow: 1px 1px 0px #000000;
  color: #9B6F1B !important;
  transition: 200ms;
}
.forum_titre a:hover
{
  color: #eee37c !important;
  transition: 200ms;
}

.icone_forum /*place les cadres des forums*/
{
  position: absolute;
  margin: 35px 0 0 -40px;
  z-index: 8;
}

.sous_forum
{
  position: absolute;
  height: 170px;
  margin: 15px 20px 0 -195px;
  text-align: center;
  overflow: auto;

}

.sous_forum a.gensmall
{
  display: inline-block;
  float: right;
  width: 180px;
  height: 18px;
  padding-top: 2px;
  background-image: url(https://i58.servimg.com/u/f58/19/65/31/91/textur12.jpg);
  color: #C49E20;
  transition: 200ms;
  border-left:1px solid #000000;
  border-right:1px solid #000000; 
}

.sous_forum a.gensmall:hover
{
  opacity: 0.8;
}

.description
{
  position: absolute;
  width: 200px;
  height: 170px;
  margin: 5px 0 0 250px;

}
.description_img
{
  position: absolute;
  width: 615px;
  height: 151px;
  border-radius:35px 35px 0 0;
  -moz-border-radius:50px 50px 0 0;
  margin-left: -252px;
  margin-top: -6px;
 
}
.descriptiongestion_img
{
  position: absolute;
  width: 189px;
  height: 116px;
  border-radius:35px 35px 0 0;
  -moz-border-radius:50px 50px 0 0;
  margin-left: 45px;
  margin-top: 15px;
}

.block {
  position: absolute;
  background: #ffffff;
  opacity: 0.3;
  height: 105px;
  width: 250px; /*largeur à modifier selon vos goûts*/
  margin-left: 10px; /* on centre le bloc */
  margin-top: 38px;
}

.description_texte
{ position: absolute;
  height: 170px;
  width: 200px;
  font-family: 'Alegreya Sans SC', sans-serif;
  font-size: 12px;
  text-align: justify;
  margin-left: -200px;
  padding-top: 45px;
}

.last_message /*les titres des derniers messages à droite*/
{
  position: absolute;
  background: url(https://img15.hostingpics.net/pics/116930Fond.png) no-repeat;
  height: 90px;
  width: 190px;
  margin-top: 25px;
  margin-left: 520px;
  text-align: center;
  padding-top: 15px;
  padding-right: -5px;
}

.last_message a
{
  font-family: 'Quicksand', sans-serif;
  font-weight: bold;
  font-style: italic;
}
.last_message a.gensmall
{
  font-size: 16px;
}

.lastpost-avatar
{
  position: absolute;
  float: none;
  width: 120px;
  height: 120px;
  top: 0;
  left: 0;
  padding: 0;
  margin-left: -158px;
  margin-top: -23px;
  border-radius: 150px;
  overflow: hidden;
  opacity: 0;
  transition: 200ms;
}
.last_message:hover .lastpost-avatar
{
  opacity: 1;
  transition: 200ms;
}
.lastpost-avatar img
{
  width: 140px;
  height: auto;
  margin-top: -30px;
  margin-left: -10px;
}
.topictitle
{
  font-family: 'Alegreya Sans SC', sans-serif;
  font-size: 16px;
  letter-spacing: 1px;
  font-weight: normal;
}
/* MESSAGES */
.mess_options
{
  position: absolute;
  width: 95%;
  margin-top: -26px;
  text-align: right;
}
.detail_mess
{
  display: block;
  text-align: right;
  font-family: 'Alegreya Sans SC', sans-serif;
  font-size: 11px;
}
.rang
{
  position: absolute;
  z-index: 6;
  margin-left: -20px;
  margin-top: -30px;
}
.pseudo
{
  position: relative;
  z-index: 7;
  display: block;
  margin-top: 15px;
  text-align: center;
  font-family: 'Alegreya Sans SC', sans-serif;
  font-weight: bold;
  font-size: 24px;
  text-shadow: 1px 1px 0px #ffffff;
}
.avatar_cadre
{
  position: relative;
  z-index: 6;
  width: 219px;
  height: 339px;
  margin: -20px auto 0 auto;
  background: url(http://img4.hostingpics.net/pics/611666fondavatar.png);
}
.avatar_contenu
{
  position: absolute;
  margin: 8px 0 0 9px;
}
.online_img
{
  position: absolute;
  z-index: 5;
  width: 342px;
  height: 467px;
  background: url(http://img4.hostingpics.net/pics/456987offline.png);
  margin-left: -80px;
}
.mess_contenu
{
  position: relative;
  z-index: 6;
  width: 96%;
  min-height: 350px;
  margin: auto;
  padding: 10px;
  background: #ffffff;
  box-shadow: 0px 0px 5px #000000;
  text-align: justify;
}
.profil_bloc
{
  position: absolute;
  z-index: 7;
  background: #141414;
  width: 190px;
  height: 310px;
  padding: 5px;
  margin-top: -331px;
  margin-left: 9px;
  text-align: center;
  font-size: 13px;
  color: #e8e8e6;
  overflow: auto;
  opacity: 0;
  transition: 200ms;
}
.profil_bloc .label
{
  display: block;
  text-align: center;
  font-family: 'Alegreya Sans SC', sans-serif;
  font-size: 18px;
  color: #424242;
}
.profil_bloc:hover
{
  opacity: 1;
  transition: 200ms;
}
.sondage
{
  width: 500px;
  margin: auto;
  background: #e8e8e6;
  border: 1px solid #ffffff;
  text-align: center;
}
.progress-bar td
{
  float: left;
  cellpadding: 0 !important;
  cellspacing: 0 !important;
  border: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
}
.quote, .spoiler_closed, .spoiler_content
{
  background: #e8e8e6;
  border: 1px solid #cdad58;
  color: #5c441e;
  padding: 5px;
}
.code
{
  background: #141414;
  border-left: 1px solid #b58832;
  border-right: 1px solid #b58832;
  border-top: 3px solid #b58832;
  border-bottom: 3px solid #b58832;
  color: #eee37c;
  padding: 5px;
}
/* QEEL */
.stats1
{
  text-align: center;
  font-family: 'Alegreya Sans SC', sans-serif;
  font-size: 16px;
  font-weight: bold;
}
.stats1 strong
{
  font-family: 'Mr Dafoe', cursive;
  font-size: 26px;
  color: #b58832;
  text-shadow: 1px 1px 0px #ffffff;
}
.stats2
{
  width: 95%;
  margin: 10px auto;
  padding: 10px;
  background: #ffffff;
  box-shadow: 0px 0px 5px #000000;
  text-align: justify;
}
/* footer*/

#blocfooter img:hover {
-webkit-animation-origin: center center;
-moz-animation-origin: center center;
-ms-animation-origin: center center;
-o-animation-origin: center center;
animation-origin: center center;
-webkit-transform: scale(1.2);
-moz-transform: scale(1.2);
-ms-transform: scale(1.2);
-o-transform: scale(1.2);
transform: scale(1.2);
}

#page-footer a
{
  font-size: 10px;
}
#page-footer div
{
  text-align: right;
}
/* TITRES SAISIE ET BOUTONS */
td.catHead, th.thHead, .thSides, .cattitle
{
  font-family: 'Mr Dafoe', cursive;
  font-size: 26px;
  font-weight: normal !important;
  color: #87652a;
}
h1, h1.pagetitle
{
  font-size: 28px;
}
input, textarea, select
{
  border: 1px solid transparent;
  background: #ffffff;
  padding: 3px;
  color: #757575;
  transition: 200ms;
}
input:focus, textarea:focus, select:focus
{
  border: 1px solid #cdad58;
  color: #424242;
  transition: 200ms;
}
#text_editor_iframe, .sceditor-container iframe, .sceditor-container textarea
{
  width: 98% !important;
}
.mainoption, .liteoption, input.button
{
  margin: 10px;
  background: #b58832;
  color: #5c441e !important;
  cursor: pointer;
  border: 1px solid #87652a;
  text-shadow: 1px 1px 0px #cdad58;
  transition: 200ms;
}
.mainoption:hover, .liteoption:hover, input.button:hover
{
  background: #cdad58;
  text-shadow: 1px 1px 0px #eee37c;
  transition: 200ms;
}
.postbody
{
  text-align: justify;
  font-size: 14px;
}
.pourcentback img
{
  background: #b58832;
}
/* RETRAIT DES BORDURES */
    .row3Right
    {
    border: none !important;
    }
    .thHead
    {
    border: none !important;
    }
    .thCornerL, .thCornerR, .thTop
    {
    border: none !important;
    }
    .thLeft, .thRight
    {
    border-left: none !important;
    border-right: none !important;
    }
    .catLeft, .catRight
    {
    border: none! important;
    }
    .catHead
    {
    border: none !important;
    }
    .catBottom
    {
    border: none !important;
    }
/*-------------------------code tout sélectionner--------------*/
.selectCode { float:right; text-transform: uppercase; cursor:pointer; }
div.cont_code { clear: right; }
/*************** fin code ******************/
/*********************** titre CB **********************/
#chatbox_header .catBottom .cattitle { content: "Rejoignez-nous sur la ";
}
#chatbox_header .cattitle:before { content: " Conciliabule"" au"" clair"" de"" lune";
padding-left: 10px;}

#chatbox_header .cattitle strong { visibility: hidden;}

#chatbox_header, td.catBottom, #chatbox_header.main-head {
  background: blue;
  height: 50px;
}

.chatbox a.cattitle, .chatbox-title, .chatbox-title a.chat-title {
  color: white !important;
}

#chatbox_members {
  background: url(https://img15.hostingpics.net/pics/155243463.jpg);
  margin-top: 20px;
  border-right: none;
}

#chatbox_members .member-title {
  background: green;
}

#chatbox {
  background: url(https://img15.hostingpics.net/pics/155243463.jpg);
  margin-top: 20px;
  border-left: none;
}

.chatbox_row_2 {
  background: yellow;
}

#chatbox_messenger .catBottom, body.chatbox, #chatbox_footer {
  background: url(https://img15.hostingpics.net/pics/155243463.jpg)!important;
}

#chatbox p {
  border: none !important;
}

#chatbox_footer #message {
  background: purple;
}

.chatbox-options a, .chatbox-options li, .chatbox-options li a, .chatbox-options li label {
  color: brown;
}

.date-and-time {
  display: none;
}

#chatbox .cb-avatar {
  width: auto !important;
  height: auto !important;
}
#chatbox .cb-avatar > img {
  width: auto !important;
  height: auto !important;
  max-width: 50px;  /*largeur maximale des avatars dans la cb*/
  max-height: 60px;  /*hauteur maximale des avatars dans la cb*/
}

Merci de m'aider s'il vous plait.

[psm]

Tu a essayer par le réglage des couleurs dans "affichage" du P.A?

PSM

[Tawn62]

Salut L'ange noir,

les bandes bleu correspondent à ceci dans ton css

Code:

#chatbox_header, td.catBottom, #chatbox_header.main-head {
  background: blue;
  height: 50px;
}

Modifie la couleur du "background: blue;" ou supprime simplement la ligne "background: blue;"

[L'ange noir]

En fait, quand je vais dans affichage, PA, cela correspond à mon html et css de la Page d'Accueil et ça ne touche rien au niveau du reste du forum. Donc c'est forcément quelque part dans le CSS. Ce que je ne comprends pas c'est pourquoi ça touche cette partie alors que j'ai codé la Chatbox. J'ai vérifié les titles, headers etc... De toute évidence c'est dans le td.catbottom et dans le main.head que cela pose souci. Mais où ????


Edit pour répondre à Tawn2 :

Je pourrais faire cela, mais je ne pourrais plus personnaliser ma CB. Ce que je cherche à faire c'est de séparer les deux codes.

Le td.catbottom et le main.head doivent correspondre à quelque chose d'autre quelque part dans le code. Soit dans le css, soit dans les templates. J'ai cherché dans le CSS et je n'ai rien vu. Dans une templates, mais laquelle ? Et surtout comment le corriger sans détruire d'autres choses ?

Pour aider je vous mets la partie de l'index-body :

Code:


{CHATBOX_BOTTOM}
<br clear="all" />
<!-- BEGIN switch_legend -->
<table border="0" cellspacing="3" cellpadding="0" align="center">
  <tr>
      <td align="center" width="20"><img src="{FORUM_NEW_IMG}" alt="{L_NEW_POSTS}" /></td>
      <td><span class="gensmall">{L_NEW_POSTS}</span></td>
      <td></td>
      <td align="center" width="20"><img src="{FORUM_IMG}" alt="{L_NO_NEW_POSTS}" /></td>
      <td><span class="gensmall">{L_NO_NEW_POSTS}</span></td>
      <td> &nbsp;</td>
      <td align="center" width="20"><img src="{FORUM_LOCKED_IMG}" alt="{L_FORUM_LOCKED}" /></td>
      <td><span class="gensmall">{L_FORUM_LOCKED}</span></td>
  </tr>
</table>
<!-- END switch_legend -->

[Neptunia]

Bonjour ^^

Et en remplaçant :

Code:

#chatbox_header, td.catBottom, #chatbox_header.main-head {
  background: blue;
  height: 50px;
}

par :

Code:

#chatbox_header, #chatbox_header.main-head {
  background: blue;
  height: 50px;
}

[L'ange noir]

Bravo. Ca a fonctionné.

Merci beaucoup.

Et ma deuxième question sur la CB était pour le footer :





Vous voyez, le footer de la CB est rogné par le bas. Du coup, on ne voit pas tout. J'ai tenté de l'aggrandir sans succès.

Une idée ?

[Neptunia]

Un code CSS que j'utilise sur mon forum. Sans garantie que cela fonctionne en phpBB2, mais me semble que maintenant la chatbox est la même quelle que soit la version.

Code:

#chatbox_footer {
  min-height: 33px;
}

[L'ange noir]

Parfait.

Merci beaucoup.