Largeur du forum

[Etoile de l'arc-en-ciel]

Bonjour,
Cela fait des heures que je recherche la réponse a ma question mais en vain j'ai fouiller de fond en comble ce forum mais je n'ai pas trouvé la réponse a ma question , alors je vais vous expliquer mon problème.

Je veux réduire la largeur de mon forum mais ma bannière est trop grande donc j'ai beau allé dans général>forum>configuration>structures des pages et mettre la largeur de mon forum à 50% sa ne marche pas. J'ai essayer aussi plusieurs code css pour tenter de rétrécir la largeur de mon forum mais en vain. S'il-vous-plait pouvez-vous m'aider à résoudre mon problème ?

Voici le lien de mon forum :
http://thedarkalliance.forumactif.org/

et mon code css modifié :

Code:

/* BARRE DE NAVIGATION */

a.mainmenu {
border-bottom: 1px dashed #929e70;
  border-top: 1px dashed #929e70;
border-right: 3px solid #929e70;
border-left: 3px solid #929e70;
background-color: #bbc995;
padding-right: 10px;
font-weight: bold;
-moz-border-radius: 0px 15px 0px 15px;
text-transform: uppercase;
color : #000000;
font-size: 12px;
}


a.mainmenu:hover{
border-bottom: 1px dotted #929e70;
  font-size: 10xp;
color: #000000;
border-top: 1px dotted #929e70;
border-right: 3px solid #929e70;
border-left: 3px solid #929e70;
text-align: center;
-moz-border-radius: 15px 0px 15px 0px;
background-color: #a9ad77;
padding-right: 10px;
}

/**PA**/
      #fond_pa {
      margin : auto;
      width : 750px;
      height : 360px;
      padding : 15px;
      background : #9aa875;
      border-width : 1px 4px 1px 4px;
      border-color : white;
      border-style : solid;
      }
     
      #fond_pa h1 {
      text-align : center;
      margin : 0 auto;
      font-size : 20px;
      color : #696969;
      text-shadow : 1px 1px 0 rgba(255,255,255,0.7);
      text-transform : uppercase;
      font-family : Calibri;
      }
     
      .contour_pa {
      display : inline-block;
      vertical-align : top;
      }
     
      #bienvenue_pa, #news_pa {
      width : 298px;
      height : 142px;
      padding : 5px;
      border-bottom : 2px dotted black;
      border-top : 2px dotted black;
      overflow : auto;
      text-align : justify;
      }
     
      #staff_pa {
      width : 298px;
      height : 142px;
      padding : 5px;
      border-bottom : 2px dotted black;
      border-top : 2px dotted black;
      overflow : hidden;
      }
     
      div.infobulles{
      opacity : 0.5;
      -moz-transition : 2s;
      -webkit-transition : 2s;
      -o-transition : 2s;
      transition : 2s;
      position : relative;
      display : inline-block;
      }
     
      div.infobulles img {
      width : 70px;
      }
     
      div.infobulles:hover{
      opacity : 1
      }
     
      div.infobulles div {
      position : absolute;
      display : none;
      }
     
      div.infobulles:hover div {
      display : inline-block;
      left : 0;
      top : 0;
      width : 58px;
      height : 58px;
      border : 1px solid #000;
      background : rgba(255,255,255,0.7);
      color : #000;
      text-align : left;
      padding : 5px;
      line-height : 15px;
      }
     
      .contour_petites_cases {
      display : inline-block;
      vertical-align : top;
      }
     
      #partenaires_pa, #credits_pa {
      width : 142px;
      height : 142px;
      padding : 5px;
      border-top : 2px dotted black;
      border-bottom : 2px dotted black;
      overflow : auto;
      text-align : center;
      }
     
      #credits_pa a {
      text-decoration : none;
      color : grey;
      text-shadow : 1px 1px 0 rgba(255,255,255,0.3);
      -moz-transition : 0.5s;
      -webkit-transition : 0.5s;
      -o-transition : 0.5s;
      transition : 0.5s;
      }
     
      #credits_pa a:hover {
      color : white;
      text-shadow : 1px 1px 0 rgba(0,0,0,0.3);
      }
     
      .transparence_logo {
      opacity : 0.5;
      -moz-transition : 2s;
      -webkit-transition : 2s;
      -o-transition : 2s;
      transition : 2s;
      }
     
      .transparence_logo:hover {
      opacity : 1;
      }
     
      #liens_pa {
      width : 116px;
      padding : 5px;
      }
     
      #liens_pa a {
      display : block;
      border-top : 2px dotted black;
      border-bottom : 2px dotted black;
      text-align : center;
      text-decoration : none;
      color : grey;
      text-shadow : 1px 1px 0 rgba(255,255,255,0.3);
      -moz-transition : 0.5s;
      -webkit-transition : 0.5s;
      -o-transition : 0.5s;
      transition : 0.5s;
      margin-bottom : -3.5px;
      }
     
      #liens_pa a:hover {
      border-top : 2px dotted white;
      border-bottom : 2px dotted white;
      color : white;
      text-shadow : 1px 1px 0 rgba(0,0,0,0.3);
      }
     
      #liens_pa a:hover:before, #liens_pa a:hover:after {
      content : " ♦ "
      }
     
      img {
      border : none
      }
/**Fin PA**/

/*Chat Box*/
#chatbox p{
  font-size: 12px;
  }

/**Profil**/
.profil_mess
{
  position: relative;
  z-index: 2;
  width: 210px;
  margin-left: auto;
  margin-right: auto;
  margin-top: 10px;
  background-color: #a2c495;
  padding: 4px;
  text-align: center;
  border-radius: 10px;
  -moz-border-radius: 10px;
  -htm-border-radius: 10px;
  -o-border-radius: 10px;
  -webkit-border-radius: 10px;
  border: 2px solid #5b5b5b;
  box-shadow: 0px 0px 5px #000000;
  -moz-box-shadow: 0px 0px 5px #000000;
  -htm-box-shadow: 0px 0px 5px #000000;
  -o-box-shadow: 0px 0px 5px #000000;
  -webkit-box-shadow: 0px 0px 5px #000000;
}

.name
{
  display: block;
  text-transform: uppercase;
  margin-top: -15px;
  margin-bottom: -10px;
  font-size: 14px;
  font-family: arial black;
  text-shadow: 1px 1px 0px #000000;
  padding-bottom: 5px;
  border-bottom: 1px dashed #5b5b5b;
}

.avatar_mess
{
  display: block;
  width: 200px;
  margin-left: auto;
  margin-right: auto;
  margin-top: 10px;
  height: 400px;
  overflow: hidden;
  border: 5px solid #0d0d0d;
  opacity: 0.7;
  -moz-opacity: 0.7;
  -khtml-opacity: 0.7;
  filter: alpha(opacity=70);
  transition: 1s;
  -moz-transition: 1s;
  -o-transition: 1s;
  -htm-transition: 1s;
  -webkit-transition: 1s;
}
.avatar_mess:hover
{
  opacity: 1;
  -moz-opacity: 1;
  -khtml-opacity: 1;
  filter: alpha(opacity=100);
  transition: 1s;
  -moz-transition: 1s;
  -o-transition: 1s;
  -htm-transition: 1s;
  -webkit-transition: 1s;
}

.profil2_mess
{
  position: relative;
  z-index: 1;
  width: 180px;
  margin-left: auto;
  margin-right: auto;
  margin-top: -202px;
  background-color: #a2c495;
  padding-left: 4px;
  padding-right: 4px;
  text-align: left;
  border-radius: 10px;
  -moz-border-radius: 10px;
  -htm-border-radius: 10px;
  -o-border-radius: 10px;
  -webkit-border-radius: 10px;
  border: 2px solid #434343;
  box-shadow: 0px 0px 5px #000000;
  -moz-box-shadow: 0px 0px 5px #000000;
  -htm-box-shadow: 0px 0px 5px #000000;
  -o-box-shadow: 0px 0px 5px #000000;
  -webkit-box-shadow: 0px 0px 5px #000000;
  color: #434343 !important;
  transform: rotate(-180deg);
  -moz-transform: rotate(-180deg);
  -o-transform: rotate(-180deg);
  -htm-transform: rotate(-180deg);
  -webkit-transform: rotate(-180deg);
  transition: 2s;
  -moz-transition: 2s;
  -o-transition: 2s;
  -htm-transition: 2s;
  -webkit-transition: 2s;
}
.profil2_mess:hover
{
  margin-top: -42px;
  transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  -htm-transform: rotate(0deg);
  -webkit-transform: rotate(0deg);
  transition: 2s;
  -moz-transition: 2s;
  -o-transition: 2s;
  -htm-transition: 2s;
  -webkit-transition: 2s;
}
.profil2_content
{
  display: block;
  width: 180px;
  height: 200px;
  max-height: 200px;
  overflow: auto;
}
/**Fin profil**/

/**Sélectionner le contenue aux balises codes**/
.selectCode { float:right; text-transform: uppercase; cursor:pointer; }
/**fin sélectionner le contenue aux balises codes**/

[missx]

salut
Comme tu le dit, ta bannière est trop large ce qui fait que c'est elle qui "commande" la largeur du forum.
Pour y remédier, tu peut via le CSS reduire cette largeur ce qui vas réduire tout ton forum.
tu met ceci dans ton css ( en modifiant a ta convenance la largeur en px)

Code:

 img#i_logo
    {
  width:800px;
  }

A+

[Etoile de l'arc-en-ciel]

Ton code marche très bien et les catégories de mon forum on rétrécie mais le problème c'est que ma bannière apparaît en tout petit comme ceci :

[missx]

là tu l'a mis a 50 px, c'est très petit !!
essaie 800

[Etoile de l'arc-en-ciel]

C'est bien mais le problème c'est que j'aimerais que la largeur des catégories soit modifiés sans que la taille de la bannière soit modifiés , est-ce possible ?

[missx]

oui, dans ce cas tu enlève le css que je t'ai donné et tu suis ce tuto
https://forum.forumactif.com/t239492-banniere-en-image-de-fond?highlight=banniere
ta bannière sera l'image de fond du forum et tu pourra modifier la taille du forum en gardant une large bannière.
A+

[Etoile de l'arc-en-ciel]

Merci pour le tuto' , cela me conviens très bien j'aimerais aussi juste que l'image soit centré et qu'elle soit fixer en haut du forum.

Edit : J'ai trouver. Sujet résolu. Merci missx !