Apparence des catégories et sous-catégories

[nyly*]

Bonjour tout le monde ^^

Alors voilà, je cherche à refaire mes catégories, et j'ai réalisé un schéma de ce que je souhaiterai faire. ^^



En fait je souhaiterai que le fond bleu soit un fond en image que je ferai moi ^^
Pour ce qui est du fond dans les descriptions des sous catégories, je souhaiterai une simple couleur, qui sera il me semble la même que le forum (là où on lit les messages ^^).
L'image du haut et du bas, je sais le faire, mais c'est pour diviser mes catégories en ces trois petites parties que je peche xD

Quelqu'un pourrait m'aider???
Je précise que mon index-box est modifié mais j'ai possibilité de le remettre par défaut pour débuter les changement.

Voici mon CSS:

Code:

        /*TITRES ET AUTRES*/
       

 .titres
{background-color: #ffffff;
color: #800000;
text-align: left;
font-family: georgia;
font-size: 20px;
line-height: 15px; }

 .annonce
{width:500px;
  Height: auto;
  background-image:url('http://i49.servimg.com/u/f49/15/49/49/31/gr1310.jpg');
  background-repeat: repeat;
  border-top: 3px solid white;
  border-bottom: 3px solid #333333;
  color: white;
}

 .fondlien
{background-image:url('http://i49.servimg.com/u/f49/15/49/49/31/gr3210.jpg');
  background-repeat: repeat;
  width: 100%;
  Height: 40px;
  margin-right: 10px;
  border-top: 3px solid white;
  border-bottom: 3px solid white;}

 .lien
{font-family:Georgia;
  Text-shadow: 1px 1px 2px white;
  letter-spacing:-1px;
  color:#800000;
font-size:30px;}

.citation
{font-family:Georgia;
  Text-shadow: 1px 1px 2px white;
  letter-spacing:-1px;
  color:#800000;
font-size:20px;}







body {
margin : 0px;
background-repeat: repeat;
  background-image: url('http://i49.servimg.com/u/f49/15/49/49/31/gr1310.jpg');

  { font-family:
 "Georgia";
      "Bookman Old Style";
        "Bookman";
      "New Century Schoolbook";
      "Bookman Antiqua";
        "Palatino";
      "Utopia";
      "New York";
      "Times New Roman";
"Times";
"serif";
"Garamond";
 
      }
 

}

.bodyline {
-moz-border-radius:10px;
border: 5px solid #800000;
  background-image:url('http://i49.servimg.com/u/f49/15/49/49/31/gr3210.jpg');
  background-repeat: repeat;

}


a:link {color: #ffffff ;}
a:visited {color: #ffffff;}
a:hover { font-weight:bold ; font-size: 11px; color: #000000; letter-spacing: 1px;  }


.navigation{
width: 110%;
color: black;
text-align:center;
font-size: 14px;
background-image: url('http://i49.servimg.com/u/f49/15/49/49/31/gr3210.jpg');
  border-top: 3px solid #800000;
  border-bottom: 3px solid #800000;
  text-shadow: #800000 1px 1px 1px ;}


/******encadrements des liens********/


.fondtitre{
display:inline;
  background-color: none;
  letter-spacing: 2px;
  width: auto;
  height: auto;
  -moz-border-radius: 8px;
  border: 1px solid  #6F86B1;
  font-family: Georgia;
  font-size: 12px;}




/******codes et citations********/


.code {
background-image:url('http://i49.servimg.com/u/f49/15/49/49/31/gr3210.jpg');
  background-repeat: repeat;
border:1px #000000 dashed;
-border-radius: 15px;
-moz-border-radius: 15px;
-webkit-border-radius: 15px;
color: black;
}


.quote {
background-image:url('http://i49.servimg.com/u/f49/15/49/49/31/gr3210.jpg');
  background-repeat: repeat;
border:1px #000000 dashed; /* bordure grise en traits peu épais */
-border-radius: 15px; /* tous les côtés sont arrondis */
-moz-border-radius: 15px; /* tous les côtés sont arrondis */
-webkit-border-radius: 15px; /* tous les côtés sont arrondis */
color: #8000000; /* couleur du texte */
}



.opacity img {
filter:alpha(opacity=50);
-moz-opacity:0.5;opacity: 0.5;
}

.opacity img:hover {
filter:alpha(opacity=100);
-moz-opacity:1;opacity: 1;
}


/******PROFIL********/

.postdetails.poster-profile a img {
-moz-border-radius-bottomleft:5px;
-moz-border-radius-bottomright:5px;
-moz-border-radius-topleft:5px;
-moz-border-radius-topright:5px;
border: 5px solid #800000;
background-image:url('http://i49.servimg.com/u/f49/15/49/49/31/gr1310.jpg');
  background-repeat: repeat;
}


.contour nom {
background-image:url('http://i49.servimg.com/u/f49/15/49/49/31/gr1310.jpg');
  background-repeat: repeat;
border: 2px solid #F3F3F0;

text-shadow: #ffffff 1px 1px 1px;
font-family: serif bold sc;
letter-spacing: -1px;
}

/*fond*/


/**************/




/**************/

a { text-decoration: none; }

body {
background-repeat : repeat;
background-position: top center;
}



/*--- Cette partie correspond à la description du forum ---*/
.forum-description {
      margin: auto;
      padding: 10px;
      color: #544E4E;
      width: 90%;
height: 30px;
overflow: auto;
      background-color: #F3F3F0;
      border: 1px dashed #E8E2DE;
      -moz-border-radius: 14px;
      -webkit-border-radius: 14px;
      font-size: 10px;
}

/*--- Cette partie correspond à l'onglet "X messages dans X sujets" ---*/
.forum-stats {
      -moz-border-radius-topleft: 20px;
      -moz-border-radius-topright: 20px;
      -webkit-border-top-right-radius: 20px;
      -webkit-border-top-left-radius: 20px;
      border-top-right-radius: 20px;
      border-top-left-radius: 20px;
      border-bottom: 0 none !important;
      border-left: 3px solid white;
      border-right: 3px solid dimgray;
      border-top: 1px solid white;
      color: black;
      background-color: none;
      font-size: 10px;
      font-style: italic;
      height: 14px;
      left: 250px;
      padding: 3px;
      position: relative;
      text-align: center;
      width: 230px;
}

/*--- Cette partie correspond à l'affichage des sous-forums ---*/
.forum-sousforum {
      color: #544E4E;
      background-color: none;
      border: 1px solid dimgray;
      border-top: 0px !important;
      -moz-border-radius-bottomleft: 14px;
      -moz-border-radius-bottomright: 14px;
      -webkit-border-bottom-right-radius: 14px;
      -webkit-border-bottom-left-radius: 14px;
      border-bottom-right-radius: 14px;
      border-bottom-left-radius: 14px;
      margin: auto;
      padding: 4px;
      color: #000000;
      width: 50%;

      text-align: center;
      min-height: 14px;
      font-size: 10px;
}

/**************/


.sujets_messages
{margin-top: 3px; /* pour faire un léger espace entre le bord et la ligne des "messages & sujets"; on évite de retirer */
padding: 3px; /* pour ne pas que le texte se colle aux bords du cadre; on évite de retirer */

/* après on peut rajouter ce qu'on veut : une bordure, une image de fond ... */
border: 1px solid #E8E2DE;
background-color: #E8E2DE;}


.derniers_sujets
{margin-top: 3px; /* pour faire un léger espace entre la ligne des "messages & sujets" et "dernier message posté", sinon ça se colle et c'est laid xD; on évite de retirer */
padding: 3px; /* pour ne pas que le texte se colle aux bords du cadre; on évite de retirer */

/* après on peut rajouter ce qu'on veut : une bordure, une image de fond, un arrondi juste sur deux côtés ... */
background-color: #F3F3F0;
border: 1px dashed #BA8283;
-moz-border-radius-topleft: 10px;
-moz-border-radius-bottomright: 10px;
-moz-border-radius-topright: 10px;
-moz-border-radius-bottomleft: 10px;
height: auto;
font-size: 10px;}


/******Ascenseur********/


.kawaii
{
position: fixed;
bottom : 0px ;
margin-left : 90%;
}


/******Maj aux membres********/

a {font-variant: small-caps;
font-size: 10px;
font-family: Arial Black;}





/******SURLIGNEMENT********/

    *::-moz-selection {
        background-color:#d5d5d5;
color:#800000;
    }

/******derniere colone caté********/
/******derniere colone caté********/
.cadre1 {
-moz-border-radius: 10px;
border-radius: 10px;
-webkit-border-radius: 10px;
border: 2px dashed #800000;
background-image:url('http://i49.servimg.com/u/f49/15/49/49/31/gr3210.jpg');
  background-repeat: repeat;
font-size: 9px
}


/****** caté********/
a.forumlink {
width: 100%;
line-height: 8px;
background-repeat: repeat;
  background-image: url('http://i49.servimg.com/u/f49/15/49/49/31/gr1310.jpg');
letter-spacing:-1px;
font-family: Times new roman;
font-size: 20px;
margin-top: 8px;
text-align: center;
 display: block;
}



/******feuille perso********/
.input, textarea, select {
background-image:url('http://i49.servimg.com/u/f49/15/49/49/31/gr3210.jpg');
color: black;
text-shadow: 1px 1px 1px white;
font-family: courrier new;
letter-spacing:-1px;
}




.profilentour {
text-align: center;
padding: 8px;
background-image:url('http://i49.servimg.com/u/f49/15/49/49/31/gr3210.jpg');
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
border-radius: 10px;
display:block;
border-right: 5px solid blake;
border-left: 5px solid blake;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
border-radius: 5px:;
padding: 2px;
}

.profilentinfos {
text-align: left;
padding: 8px;
background-image:url('http://i49.servimg.com/u/f49/15/49/49/31/gr3210.jpg');
display:block;
border-right: 5px solid black;
border-left: 5px solid white;
padding: 2px;



}


.profiledetails {
font-family: GEORGIA;
text-align: center;
padding: 8px;
background-image:url('http://i49.servimg.com/u/f49/15/49/49/31/gr3210.jpg');
text-align: center;
}


.profil1{
font-family: GEORGIA;
background-image:url('hhttp://i49.servimg.com/u/f49/15/49/49/31/gr3210.jpg');
  font-family: Trebuchet MS;
          font-size: 11px;
div style=" width: 30px;
span style="font-size: 18px;
 font-style: font-weight: font: arial black;
 color: #EB500B;
 text-shadow: 1px 1px 1px black

 
width: 130px; height:30px;
-moz-border-radius : 10px 10px 10px 10px;
border: 2px solid #FFFFFF;
padding-right: 10px; padding-left: 10px;"
text-align: center;
}





/*ACCORDEON*/


    .accordion { text-align: left; font: 'Helvetica Neue', Verdana, Arial, sans-serif; }
    .accordion ol { position: relative; overflow: hidden; height: 100%; margin: 0; padding: 0; list-style-type: none; }
    .accordion li > h2 { color: black; font-weight: normal; margin: 0; z-index: 2; position: absolute; top: 0; left: 0; -webkit-transform: translateX(-100%) rotate(-90deg); -webkit-transform-origin: right top; -moz-transform: translateX(-100%) rotate(-90deg); -moz-transform-origin: right top;
      -o-transform: translateX(-100%) rotate(-90deg); -o-transform-origin: right top; -ms-transform: translateX(-100%) rotate(-90deg); -ms-transform-origin: right top; transform: translateX(-100%) rotate(-90deg); transform-origin: right top; filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3); }
    .accordion li > h2 span { display: block; padding-right: 8%; text-align: right; height: 90%; margin-top: 5px; }
    .accordion li > h2 b { display: inline-block; position: absolute; top: 10%; top: 42%\9; left: 10%; left: 5%\9; text-align: center; -webkit-transform: rotate(90deg); -moz-transform: rotate(90deg); -o-transform: rotate(90deg); transform: rotate(90deg); filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=1); }
    .accordion li > h2:hover { cursor: pointer; }
    .accordion li > div { height: 100%; position: absolute; top: 0; z-index: 1; overflow: hidden; background: white; }
    .accordion noscript p { padding: 10px; margin: 0; background: white; }

    /****************************************** Basic */
    .basic li > h2 { background: #333; color: white; line-height: 1.8em; }
    .basic li > div h3 { margin: 15px 10px; }
    .basic li > div p { margin: 10px; font-size: 14px; }

    /****************************************** Dark */
    .dark { border: 9px solid #353535; border-bottom-width: 8px; padding: 5px 5px 6px 0; background: #030303; -webkit-box-shadow: 0 -1px 0 #5b5b5b inset, 0 5px 15px rgba(0, 0, 0, 0.4); -moz-box-shadow: 0 -1px 0 #5b5b5b inset, 0 5px 15px rgba(0, 0, 0, 0.4); -o-box-shadow: 0 -1px 0 #5b5b5b inset, 0 5px 15px rgba(0, 0, 0, 0.4);
      box-shadow: 0 -1px 0 #5b5b5b inset, 0 5px 15px rgba(0, 0, 0, 0.4); }
    .dark li > h2 { background: #030303; font-size: 16px; line-height: 2.7em; text-shadow: 0 -1px 0 #030303; }
    .dark li > h2 span { background: #353535; color: white; }
    .dark li > h2 b { background: #353535\9; color: #030303; font-size: 20px; text-shadow: -1px 1px 0 #5b5b5b; }
    .dark h2.selected span, .dark h2.selected span:hover { background: #434343; background: -webkit-gradient(linear, left top, right top, color-stop(0, #353535), color-stop(1, #555555)); background: -moz-linear-gradient(top left, #353535 0%, #555555 100%); }
    .dark h2.selected b { background: #434343\9; }
    .dark li > div { background: #030303; margin-left: 5px; }

    /*************************************** Rounded */
    .rounded { -webkit-border-radius: 6px; -moz-border-radius: 6px; border-radius: 6px; }
    .rounded li > h2 span { -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; }

    /***************************************** Light */
    /**************************************** Stitch */









 /*******TABLEAU A ONGLETS*******/


            .mon_onglet{
          display: block;
          padding: 5px;
          margin: 4px;
          color: #000;
          }
       
        .mon_onglet:hover{
          background: none;
box-shadow: 2px 2px 2px #800000;} 
         
        .mon_onglet_selected{
          display: block;
          padding: 5px;
          margin: 4px;
          background: none;
box-shadow: 2px 2px 2px #800000;}
               
        .clear{
          clear: both;}
       
        .mon_contenu{
          color: #000;
          background: #D6D6D6;
          border: 3px double #800000;
          padding: 10px;
          margin: 10 px;
          height: 120px;
          line-height: normal;
          font-size: 12px;
width: 230px;
height: 200px;}
       
        #mes_contenus, #mes_onglets{
          height: 100%;
          width:100%;}
/*INFOBULLE*/

            .lock  {
          position: relative;
          cursor: pointer;
  border: 2px solid none;
          border-radius: 15px;
        }
        .lock .lock-hidden {
          /* center */
          display: none;
          position: absolute;
          padding-left : 1px;
          padding-right : 1px;
          padding-top  : 1px;
          padding-bottom : 1px;
            top: 0px;
            left: 0px;
          /* style du bloc qui apparait */
          border: 2px solid black;
          border-radius: 15px;
          background-color: #800000;
  font-family: courrier new
          -moz-border-radius: 5px;
          text-align: center;
            visibility: visible;
  width: 110px;
  height: 90px;
        }
        .lock:hover .lock-hidden {
          display: block;
        }

/**************/

      1. .liensutiles{
      2. border-left: 3px solid #000;}
      3. .liensutiles :hover{
      4. border-left: 3px solid #fff;}



/*-----------------------QEEL by Coma-----------------------*/
.fontqeel {
  background-image:url('http://i49.servimg.com/u/f49/15/49/49/31/gr3210.jpg');
  background-repeat: repeat;
  -moz-border-radius: 20px; /* Coins arrondis sous Mozilla */
  -webkit-border-radius: 20px; /* Coins arrondis sous Chrome */
  border-radius:20px; /* Coins arrondis sur les navigateurs récents */
}

.groupes {
  text-transform: uppercase;/* transforme le texte en lettres majuscules */
  font-weight : bold;/*texte en gras*/
  font-size:14px; /* Taille du texte */
}

.liste24h {
  height:40px; /* hauteur de la liste des utilisateurs connectés au cours des dernières heures */
  overflow:auto; /* scroll automatique quand la hauteur dépasse */
}

.liste24h td.row1{
  background:#D9C0A4; /*couleur de fond (la meme que celle de votre QEEL de preference) */
}


/******QEEL********/


/*partie des connectés*/
.connectnow {
WIDTH: 96%;
HEIGHT: 110px;
OVERFLOW: auto;
border-left: 4px double #800000;
  border-right: 4px double #800000;
-moz-border-radius: 10px;
font-family: Times new roman;
font-size: 12px;
background-image:url('http://i49.servimg.com/u/f49/15/49/49/31/gr3210.jpg');
  background-repeat: repeat;
}


/*partie des connectés depuis 24h*/
.liste24h {
WIDTH: 96%;
HEIGHT: 110px;
OVERFLOW: auto;
border-left: 4px double #333333;
  border-right: 4px double #ffffff;
-moz-border-radius: 10px;
font-family: Times new roman;
font-size: 12px;
background-image:url('http://i49.servimg.com/u/f49/15/49/49/31/gr3210.jpg');
  background-repeat: repeat;;
}

/*partie des stats*/
.infos {

-moz-border-radius: 0px;
text-align: justify;
font-family: Times new roman;
font-size: 16px;
  width: 400px;
  text-align:justify
    background-image:url('http://i49.servimg.com/u/f49/15/49/49/31/gr3210.jpg');
  background-repeat: repeat;

}

/*cadre avec groupes*/
.groupes {

-moz-border-radius: 15px15px 0px 0px;
background-image:none;
text-align: center;
font-family: georgia;
font-size: 18px;
letter-spacing:1px;
}

/*qeel entier*/
.qeel {
border-top : 5px solid #A3C3C3;
border-bottom : 2px solid #333333;
-moz-border-radius: 15px;
background-color:#800000;
}


.cadre2 {
border-top : 5px solid #A3C3C3;
border-bottom : 4px solid #333333;
-moz-border-radius: 15px 15px 0px 0px;
background-color:none;

}





       








/*partie description de groupes*/
.descripgroupe {
border-top : 5px solid #800000;
border-bottom : 4px solid #333333;
-moz-border-radius: 15px15px 0px 0px;
background-color:none;
text-align: center;
font-family: georgia;
font-size: 16px;
letter-spacing:1px;
  width: 150px;
height: 150px;
}
/*partie des groupes*/
.groupe {
 
border : 1px solid #ff0000;
}





.secondarytitle {
    background-image: url('http://i49.servimg.com/u/f49/15/49/49/31/catabi10.png');
    background-repeat: no-repeat;
    background-color: transparent;
    height: 250px;
    width: 800px;
    }
 
    .imgbas {
    background-image: url('http://i49.servimg.com/u/f49/15/49/49/31/bas_bi10.png');
    background-repeat: no-repeat;
    background-color: transparent;
    height: 151px;
    width: 800px;
    }

        .catposition a {
position : relative;
left : 80px;
bottom : 60px;
}


        /*CHATBOX*/
        body.chatbox {
            background-image:url('http://i49.servimg.com/u/f49/15/49/49/31/gr3210.jpg');
  background-repeat: repeat;
        }
        #chatbox_header .chatbox-options .genmed,
        #chatbox_header .chatbox-options,
        #chatbox_header .chatbox-options a {
            color: #800000;
  background-repeat: repeat;
  background-image: url('http://i49.servimg.com/u/f49/15/49/49/31/gr1310.jpg');
        }
body.chatbox {
    background-color: none;
}
        .chatbox_row_1,
        .chatbox_row_2,
        .chatbox_row_3,
        .chatbox_row_1 a,
        .chatbox_row_2 a,
        .chatbox_row_3 a  {
            color: white;
        }

Merci à ceux qui lisent ^^

[Dr. Karlos]

Bonsoir,

Je vais réaliser tout, excepté les images puisque vous semblez savoir comment le faire et je ne suis pas un expert dans le domaine

Votre template index_box est-il modifié?


Cordialement,

---

Dr. Karlos
Aidant Forumactivien.

[nyly*]

Oui il est modifié, mais les effets ne me vont plus du tout
C'est pourquoi je compte partir d'un index-box par défaut ^^
Je vous en donne un?

Sinon voici le miens:

Code:

<table width="100%" border="0" cellspacing="1" cellpadding="0" align="center">
      <tr>
          <td valign="bottom">
            <!-- BEGIN switch_user_logged_in -->
            <span class="gensmall">{LAST_VISIT_DATE}<br />
            {CURRENT_TIME}<br />
            </span>
            <!-- END switch_user_logged_in -->
            <div class="nav"><a class="nav" href="{U_INDEX}">{L_INDEX}</a>{NAV_CAT_DESC}</div>
          </td>
          <td class="gensmall" align="right" valign="bottom">
            <!-- BEGIN switch_user_logged_in -->
            <a class="gensmall" href="{U_SEARCH_NEW}">{L_SEARCH_NEW}</a><br />
            <a class="gensmall" href="{U_SEARCH_SELF}">{L_SEARCH_SELF}</a><br />
            <!-- END switch_user_logged_in -->
            <a class="gensmall" href="{U_SEARCH_UNANSWERED}">{L_SEARCH_UNANSWERED}</a>
          </td>
      </tr>
    </table>
    <!-- BEGIN catrow --><!-- BEGIN tablehead --><table class="forumline" width="100%" border="0" cellspacing="0" cellpadding="0" style="border : 0px solid transparent;">
      <tr>
 <td colspan="3" nowrap="nowrap" width="100%" class="secondarytitle"> <div class="catposition">{catrow.tablehead.L_FORUM} </div></td>
      </tr>
      <!-- END tablehead -->
      <!-- BEGIN cathead -->
      <tr>
          <!-- BEGIN inc -->
          <td class="{catrow.cathead.inc.INC_CLASS}" width="46"><img src="{SPACER}" height="0" width="46" /></td>
          <!-- END inc -->
          <td class="{catrow.cathead.CLASS_CAT}" colspan="{catrow.cathead.INC_SPAN}" width="100%">
            <h{catrow.cathead.LEVEL} class="hierarchy">
                <span class="cattitle">
                  <a class="cattitle" title="{catrow.cathead.CAT_DESC}" href="{catrow.cathead.U_VIEWCAT}">{catrow.cathead.CAT_TITLE}</a>
                </span>
            </h{catrow.cathead.LEVEL}>
          </td>
          <td class="{catrow.cathead.CLASS_ROWPIC}" colspan="3" align="right"> </td>
      </tr>
      <!-- END cathead -->
      <!-- BEGIN forumrow -->
      <tr>
          <!-- BEGIN inc -->
          <td class="{catrow.forumrow.inc.INC_CLASS}" width="46"><img src="{SPACER}" height="0" width="46" alt="." /></td>
          <!-- END inc -->
          <td class="{catrow.forumrow.INC_CLASS}" align="center" valign="middle">
            <img title="{catrow.forumrow.L_FORUM_FOLDER_ALT}" src="{catrow.forumrow.FORUM_FOLDER_IMG}" alt="{catrow.forumrow.L_FORUM_FOLDER_ALT}" />
          </td>
            <td class="row1 over" colspan="{catrow.forumrow.INC_SPAN}" valign="top" width="100%" height="50">
            <h{catrow.forumrow.LEVEL} class="hierarchy">
                <span class="forumlink">
                  <a class="forumlink" href="{catrow.forumrow.U_VIEWFORUM}"><span class="gradualfader">{catrow.forumrow.FORUM_NAME}</span></a><br />
                </span>
            </h{catrow.forumrow.LEVEL}>
            <span class="genmed">{catrow.forumrow.FORUM_DESC}</span>
            <span class="gensmall">
                <!-- BEGIN switch_moderators_links -->
                {catrow.forumrow.switch_moderators_links.L_MODERATOR}{catrow.forumrow.switch_moderators_links.MODERATORS}
                <!-- END switch_moderators_links -->
                {catrow.forumrow.L_LINKS}{catrow.forumrow.LINKS}
            </span>
          </td>
          <!-- BEGIN forum_link_no -->
                                      <td align="center" valign="middle" height="50" style="min-width: 150px;">
    <div class="cadre1">{catrow.forumrow.POSTS} messages dans {catrow.forumrow.TOPICS} sujets.<br />
            <span class="gensmall">{catrow.forumrow.LAST_POST}</span></div>
          </td>
      </tr>
<!-- END forum_link_no -->
          <!-- BEGIN forum_link -->
          <td class="row3" colspan="3" align="center" valign="middle" height="50"><span class="gensmall">{catrow.forumrow.forum_link.HIT_COUNT}</span></td>
          <!-- END forum_link -->
     
      <!-- END forumrow -->
   

      <!-- BEGIN catfoot -->
      <tr>
          <!-- BEGIN inc -->
          <td class="{catrow.catfoot.inc.INC_CLASS}" width="46"><img src="{SPACER}" height="0" width="46" /></td>
          <!-- END inc -->
          <td class="spaceRow" colspan="{catrow.catfoot.INC_SPAN}" height="1"><img src="{SPACER}" alt="" height="1" width="1" /></td>
      </tr>
      <!-- END catfoot -->
 <!-- BEGIN tablefoot --><tr><td colspan="3"><div class="imgbas"> </div></td></tr>
    </table><img src="{SPACER}" alt="" height="10" width="1" /><!-- END tablefoot -->
      <!-- END catrow -->

[Dr. Karlos]

Bonjour,

Essayez de placer ceci dans votre template index_box:

Code:

<table width="100%" border="0" cellspacing="0" cellpadding="0" align="center">
   <tr>
      <td valign="bottom">
         <!-- BEGIN switch_user_logged_in -->
         <span class="gensmall">{LAST_VISIT_DATE}<br />
         {CURRENT_TIME}<br />
         </span>
         <!-- END switch_user_logged_in -->
         <div class="nav"><a class="nav" href="{U_INDEX}">{L_INDEX}</a>{NAV_CAT_DESC}</div>
      </td>
      <td class="gensmall" align="right" valign="bottom">
         <!-- BEGIN switch_user_logged_in -->
         <a class="gensmall" href="{U_SEARCH_NEW}">{L_SEARCH_NEW}</a><br />
         <a class="gensmall" href="{U_SEARCH_SELF}">{L_SEARCH_SELF}</a><br />
         <!-- END switch_user_logged_in -->
         <a class="gensmall" href="{U_SEARCH_UNANSWERED}">{L_SEARCH_UNANSWERED}</a>
      </td>
   </tr>
</table>
<!-- BEGIN catrow --><!-- BEGIN tablehead --><table class="forumline" width="100%" border="0" cellspacing="10" cellpadding="0">

   <!-- END tablehead -->
   <!-- BEGIN cathead -->
   <tr>
      <!-- BEGIN inc -->
      <td class="{catrow.cathead.inc.INC_CLASS}" width="46"><img src="{SPACER}" height="0" width="46" /></td>
      <!-- END inc -->
      <td class="{catrow.cathead.CLASS_CAT}" colspan="{catrow.cathead.INC_SPAN}" width="100%">
         <h{catrow.cathead.LEVEL} class="hierarchy">
            <span class="cattitle">
               <a class="cattitle" title="{catrow.cathead.CAT_DESC}" href="{catrow.cathead.U_VIEWCAT}">{catrow.cathead.CAT_TITLE}</a>
            </span>
         </h{catrow.cathead.LEVEL}>
      </td>
      <td class="{catrow.cathead.CLASS_ROWPIC}" colspan="3" align="right"> </td>
   </tr>
   <!-- END cathead -->
   <!-- BEGIN forumrow -->
   <tr>
      <!-- BEGIN inc -->
      <td class="{catrow.forumrow.inc.INC_CLASS}" width="46"><img src="{SPACER}" height="0" width="46" alt="." /></td>
      <!-- END inc -->
      <td class="{catrow.forumrow.INC_CLASS}" align="center" valign="middle">
         <img title="{catrow.forumrow.L_FORUM_FOLDER_ALT}" src="{catrow.forumrow.FORUM_FOLDER_IMG}" alt="{catrow.forumrow.L_FORUM_FOLDER_ALT}" />
                  </td>
      <td class="row1 over" colspan="{catrow.forumrow.INC_SPAN}" valign="top" width="100%" height="50">
         <h{catrow.forumrow.LEVEL} class="hierarchy">
            <span class="forumlink">
               <a class="forumlink" href="{catrow.forumrow.U_VIEWFORUM}">{catrow.forumrow.FORUM_NAME}</a><br />
            </span>
         </h{catrow.forumrow.LEVEL}>
                  <div class="forumdesc"><span class="genmed">{catrow.forumrow.FORUM_DESC}</span></div>
         <span class="gensmall">
            <!-- BEGIN switch_moderators_links -->
            {catrow.forumrow.switch_moderators_links.L_MODERATOR}{catrow.forumrow.switch_moderators_links.MODERATORS}
            <!-- END switch_moderators_links -->
            {catrow.forumrow.L_LINKS}{catrow.forumrow.LINKS}
         </span>
      </td>
      <td class="row3 over" align="center" valign="middle" height="50">
                  <span class="gensmall">Il y a {catrow.forumrow.POSTS} messages dans {catrow.forumrow.TOPICS} sujets. <br /><br /> <br /><br /> {catrow.forumrow.LAST_POST}</span>
      </td>
   </tr>
   <!-- END forumrow -->
   <!-- BEGIN catfoot -->
   <tr>
      <!-- BEGIN inc -->
      <td class="{catrow.catfoot.inc.INC_CLASS}" width="46"><img src="{SPACER}" height="0" width="46" /></td>
      <!-- END inc -->
      <td class="spaceRow" colspan="{catrow.catfoot.INC_SPAN}" height="1"><img src="{SPACER}" alt="" height="1" width="1" /></td>
   </tr>
   <!-- END catfoot -->
   <!-- BEGIN tablefoot -->
</table><img src="{SPACER}" alt="" height="5" width="1" /><!-- END tablefoot --><!-- END catrow -->

Et d'ajouter ceci à votre CSS:

Code:

td.row1.over, td.row3.over, .row1 {
  -webkit-border-radius: 20px;
-moz-border-radius: 20px;
border-radius: 20px;
  }


.forumdesc {
max-height : 150px;
overflow-y:scroll !important;
overflow-x:hidden !important;
}

Cordialement,

---

Dr. Karlos
Aidant Forumactivien.

[nyly*]

C'est à peu près ce que je souhaite merci ^^
Mais j'aurais voulu une couleur de fond derrière les catégories et là elle n'y est pas, de plus je n'arrive pas à changer la taille, qui est beaucoup trop large.

Comment puis-je faire?

[Dr. Karlos]

Bonsoir,

Où désirez-vous avoir l'image? Montrez-moi les zones sur cette image (ne vous fiez pas aux barres rouges):



Et encore, quelle colonne voulez-vous réduire? De largeur ou hauteur? Puis-je avoir l'adresse de votre forum?


Cordialement,

---

Dr. Karlos
Aidant Forumactivien.

[nyly*]

Je vous remet l'image de mon schéma ^^ et voici l'adresse de mon forum test:
http://test-jenny.forumgratuit.org/



le fond bleu sur ce schéma, je voudrais le faire, parce que je n'arrive pas à le faire, mon fond est transparent derrière, si je met une couleur en fond de page, elle sera aussi derrière ma bannière, chose que je ne veux pas.

Pour ce qui est de la taille, je voudrais réduire la largeur de la case centrale, et les espacer un peu plus pour que l'on voit mieux la couleur d'arrière plan, comme sur mon image en fait ^^
Tout çà bien sur, pour que ça ne dépasse pas de mon image en haut des catégories, qui fait 800px de large ^^

Vous voyez ce que je veux dire??

[Invité]

Bonjour, Où en-est votre problème ? Deux solutions : Votre problème est résolu, dans ce cas pensez à nous le signaler en cochant l'icône en éditant votre premier message, Votre problème est toujours d'actualité, et dans ce cas pensez à faire des UP régulièrement, afin de ne pas voir votre sujet délesté, A bientôt sur ForumActif

[nyly*]

Mon problème est toujours d'actualité.

Je fais donc un petit Up ^^

[Dr. Karlos]

Bonjour,

Essayez avec ce template:

Code:

<table width="100%" border="0" cellspacing="0" cellpadding="0" align="center">
  <tr>
      <td valign="bottom">
        <!-- BEGIN switch_user_logged_in -->
        <span class="gensmall">{LAST_VISIT_DATE}<br />
        {CURRENT_TIME}<br />
        </span>
        <!-- END switch_user_logged_in -->
        <div class="nav"><a class="nav" href="{U_INDEX}">{L_INDEX}</a>{NAV_CAT_DESC}</div>
      </td>
      <td class="gensmall" align="right" valign="bottom">
        <!-- BEGIN switch_user_logged_in -->
        <a class="gensmall" href="{U_SEARCH_NEW}">{L_SEARCH_NEW}</a><br />
        <a class="gensmall" href="{U_SEARCH_SELF}">{L_SEARCH_SELF}</a><br />
        <!-- END switch_user_logged_in -->
        <a class="gensmall" href="{U_SEARCH_UNANSWERED}">{L_SEARCH_UNANSWERED}</a>
      </td>
  </tr>
</table>
<!-- BEGIN catrow --><!-- BEGIN tablehead --><table class="tableaupa" width="100%" border="0" cellspacing="10" cellpadding="0">
 
  <!-- END tablehead -->
  <!-- BEGIN cathead -->
  <tr>
      <!-- BEGIN inc -->
      <td class="{catrow.cathead.inc.INC_CLASS}" width="46"><img src="{SPACER}" height="0" width="46" /></td>
      <!-- END inc -->
      <td class="{catrow.cathead.CLASS_CAT}" colspan="{catrow.cathead.INC_SPAN}" width="100%">
        <h{catrow.cathead.LEVEL} class="hierarchy">
            <span class="cattitle">
              <a class="cattitle" title="{catrow.cathead.CAT_DESC}" href="{catrow.cathead.U_VIEWCAT}">{catrow.cathead.CAT_TITLE}</a>
            </span>
        </h{catrow.cathead.LEVEL}>
      </td>
      <td class="{catrow.cathead.CLASS_ROWPIC}" colspan="3" align="right"> </td>
  </tr>
  <!-- END cathead -->
  <!-- BEGIN forumrow -->
  <tr>
      <!-- BEGIN inc -->
      <td class="{catrow.forumrow.inc.INC_CLASS}" width="46"><img src="{SPACER}" height="0" width="46" alt="." /></td>
      <!-- END inc -->
      <td class="{catrow.forumrow.INC_CLASS}" align="center" valign="middle">
        <img title="{catrow.forumrow.L_FORUM_FOLDER_ALT}" src="{catrow.forumrow.FORUM_FOLDER_IMG}" alt="{catrow.forumrow.L_FORUM_FOLDER_ALT}" />
                  </td>
      <td class="row1 over" colspan="{catrow.forumrow.INC_SPAN}" valign="top" width="100%" height="50">
        <h{catrow.forumrow.LEVEL} class="hierarchy">
            <span class="forumlink">
              <a class="forumlink" href="{catrow.forumrow.U_VIEWFORUM}">{catrow.forumrow.FORUM_NAME}</a><br />
            </span>
        </h{catrow.forumrow.LEVEL}>
                  <div class="forumdesc"><span class="genmed">{catrow.forumrow.FORUM_DESC}</span></div>
        <span class="gensmall">
            <!-- BEGIN switch_moderators_links -->
            {catrow.forumrow.switch_moderators_links.L_MODERATOR}{catrow.forumrow.switch_moderators_links.MODERATORS}
            <!-- END switch_moderators_links -->
            {catrow.forumrow.L_LINKS}{catrow.forumrow.LINKS}
        </span>
      </td>
      <td class="row3 over" align="center" valign="middle" height="50">
                  <span class="gensmall">Il y a {catrow.forumrow.POSTS} messages dans {catrow.forumrow.TOPICS} sujets. <br /><br /> <br /><br /> {catrow.forumrow.LAST_POST}</span>
      </td>
  </tr>
  <!-- END forumrow -->
  <!-- BEGIN catfoot -->
  <tr>
      <!-- BEGIN inc -->
      <td class="{catrow.catfoot.inc.INC_CLASS}" width="46"><img src="{SPACER}" height="0" width="46" /></td>
      <!-- END inc -->
      <td class="spaceRow" colspan="{catrow.catfoot.INC_SPAN}" height="1"><img src="{SPACER}" alt="" height="1" width="1" /></td>
  </tr>
  <!-- END catfoot -->
  <!-- BEGIN tablefoot -->
</table><img src="{SPACER}" alt="" height="5" width="1" /><!-- END tablefoot --><!-- END catrow -->

Et ce CSS:

Code:

.tableaupa {
   background-color:#477697;
  padding-top: 40px;
  padding-bottom: 200px;
   }


td.row1.over, td.row3.over, .row1, .tableaupa {
  -webkit-border-radius: 20px;
-moz-border-radius: 20px;
border-radius: 20px;
  }
 
 
.forumdesc {
max-height : 150px;
overflow-y:scroll !important;
overflow-x:hidden !important;
}

Par contre, pour l'ajout d'images, je n'ai pas réussi à les faire entrer dans le cadre bleu. Je laisse donc ma place à quelqu'un d'autre


Cordialement,

---

Dr. Karlos
Aidant Forumactivien.

[nyly*]

Merci beaucoup ça m'a bien aidé, j'ai réussi à mettre mes images et faire tout à mon gout, mais je n'arrive pas à la centrer (celle en dessus des catégories), quelqu'un saurait à tout hasard, j'essaye depuis des heures :/

[Dr. Karlos]

Bonsoir,

Collez votre template et votre CSS, je vais essayer de le faire, sinon un autre membre vous aidera.

[nyly*]

En fait c'est bon j'ai réussi à me débrouiller après avoir chercher un moment.

Merci, sujet résolu