Mettre une image au dessus des catégories par template

[Alec Turner]

Bonsoir c'est encore moi, je mets en pratique mes idées donc forcément parfois ca plante. J'ai tenté de mettre une image de dessus de catégories, j'ai bien réussi, j'ai utilisé ce tuto:

Spoiler:

alors effectivement ca marche, je vois bien une image mais seulement un petit bout. Qui plus est il ajoute des morceaux en dessous de ma catégorie

Par la même occasion comment ajouter une image en dessous de la catégorie?

[SoraNoHime]

Bonsoir

pour l'image idem que la réponse que je viens de vous donné pour dernier sujet. Mettez les dimensions de l'image.

Cela marche-t-il ? nous verrons ensuite pour l'image en dessous.

[Alec Turner]

non malheureusement j'avais essayé tout a l'heure mais sans succes j'ai réessayé mais rien

[SoraNoHime]

Vous les avez changé dans la css ? je m'aperçois qu'elles sont dans le code html ici

Code:

<div style="background-image : url(TON LIEN) ; background-repeat : no-repeat ; width : 450px ; height : 50px"><div class="catégoz">{catrow.tablehead.L_FORUM}</div></div>

[Alec Turner]

ca fonctionne je ne l'avais pas vu a vrai dire merci. Mais est-ce logique que l'image aille se mettre en dessous également regarde

http://wthell.forumgratuit.be/

[SoraNoHime]

Quelle est votre niveau de hiérarchie ?

cela peut influencer sur ce code.

[Alec Turner]

Séparer les catégories sur l'index :--< moyen

[SoraNoHime]

Donc bizarre ,puis-je avoir votre index_box complet pour réparer cela, et la css associée ?

Cordialement.

[Alec Turner]

bien sur sans soucis ( tu vas beaucoup me voir cette semaine ^-^)

[SoraNoHime]

^^ Je sais d'ou vient le problème, tu crées des catégories en onglets. le fait de mettre une image en haut du header fausse le code des onglets justement.

J'ai eu le tour déjà. Tes onglets ne sont pas actifs donc on ne peut voir le problème. Et ça donne une redondance puisque les catégories masqués par les onglets apparaissent du coup. Il me faudrait vraiment ta css complèt cette fois.

[Alec Turner]

oki ( elle est en reconstruction donc ne t'etonne pas si la partie du bas est un peu bordélique)

Code:

/* ------/*CORPS DU FORUM*/---------------  */


body{
   
background-attachment: fixed;
background-position:top center, center;
background-repeat:repeat;
padding-bottom: 6px;
text-align:justify;
padding-top: 0px;
width: 600px;
}



/* ------------------QEEL PERSONNALISE---------------  */

.trans .row1 {background-color :transparent;}

.qeel {

background-image: url('http://i44.servimg.com/u/f44/11/74/97/65/fond_c10.png');
border: 1px dotted #324cd1;
 width: 700px;
text-align:justify;
padding-left: 6px;
}

.stats{

background-image: url('http://i44.servimg.com/u/f44/11/74/97/65/fond_313.png');
-moz-border-radius-bottomleft:5px;
-moz-border-radius-bottomright:5px;
-moz-border-radius-topleft:5px;
-moz-border-radius-topright:5px;

}




/* ------------------PA PERSONNALISEE---------------  */

.pimentine {


background-color: #none;
background-image: url('http://i44.servimg.com/u/f44/11/74/97/65/fond_c10.png');
-moz-border-radius-bottomleft:5px;
-moz-border-radius-bottomright:5px;
-moz-border-radius-topleft:5px;
-moz-border-radius-topright:5px;
width: 590px;

}

/* ------------------CSS CATEGORIES---------------  */

  .cadredulast{
    background-color:none;
    background-image: url('http://i44.servimg.com/u/f44/11/74/97/65/esaai10.png');
    background-position:center;
    background-repeat:no-repeat;
    padding: 2px;
    margin: 5px;
    text-align: center;
    border: 0px dotted #324cd1;
    height : 150px;
    width : 130px;
    font-size : 9px;
    }

    .descriptionforums{
    height: 100px;
    width: 465px;
    margin: 5px;
    text-align: justify;
    background-image: url('http://i44.servimg.com/u/f44/11/74/97/65/fond_c10.png');
    border: 1px dotted #324cd1;
    padding: 2px;
    }

  .espace1 {
  background-color : #none
  height : 0px;
}

 .espace2 {
 background-color : #none;
 height : 0px;
}






/* ----------------- CAT EN ONGLETS ------------------  */
.onglet{
display:inline-block;
padding:5px;
    }

#conteneur_barre_onglet
 {
-moz-border-radius-bottomleft:5px;
-moz-border-radius-bottomright:5px;
-moz-border-radius-topleft:5px;
-moz-border-radius-topright:5px;
border:1px dotted #122d69;
background-color:#none;
color:#4c8e9e;
font-size : 11px;
background-image: url('http://i44.servimg.com/u/f44/11/74/97/65/fond_c10.png');
padding:8px;
display:block;
 position:relative;
 left:-250px;
 top:100px;
width:100px;}




/* ---------------- TITRES------------------------ */
   
   
a.forumlink {

color:#414f94;
font-family: Times New Roman;
font-weight: normal;
font-size:25px;
text-transform: lowercase;
display:block;
text-align: center;
border-bottom: 1px  dotted #1e39bd ;
border-align: center;
width: 90%;
   

display: block;
moz-border-radius: 10px 10px 0px 0px;
-moz-text-shadow: 4px 3px 3px 4px #1a25ff;
-webkit-text-shadow:4px 3px 3px 4px #1a25ff;
text-shadow:  4px 3px 3px 4px #1a25ff;
}
   
a.forumlink:hover /* pour les liens des titres : halo doré */
   {
     text-shadow: #a8a9c44px  2px 2px 4px;
   }





   /* -----------------DIVERS-----------------  */

.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;
}







   /* -----------------INFOBULLES ------------------  */
   a.imginfo {
     position: relative;
     color: #684f39;
     text-decoration: none;
     border-bottom: 0px #732d8ac DOTTED; /* on souligne le texte */
   }
   
   a.imginfo span {
     display: none; /* on masque l'infobulle */
   }
   a.imginfo:hover {
     background: none; /* correction d'un bug IE */
     z-index: 999; /* on définit une valeur pour l'ordre d'affichage */
     cursor: help; /* on change le curseur par défaut en curseur d'aide */
   }
   a.imginfo:hover span {
     display: inline; /* on affiche l'infobulle */
     position: absolute;
     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: 5px; /* on positionne notre infobulle */
left: 5px;
color: #C3AC92;
background-color: #222429;
padding: 3px;
font-size: 9px;
font-family: tahoma;
border: 0px solid grey;
border-left: 2px solid #3c5282;
border-right: 2px solid #3c5282;
border-top: 2px solid #3c5282;
border-bottom: 2px solid #3c5282;

   }



/* ------/*IMAGE HAUT CATEGORIE*/---------------  */

.catégoz {
text-align : center ;
position : relative ;
top : 20px ;
text-transform : uppercase;
letter-spacing : 2px ;
height: 121px;
}

   /* ------------------PAGE ACCUEIL------------------  */
   

.box {
-moz-border-radius-bottomleft:5px;
-moz-border-radius-bottomright:5px;
-moz-border-radius-topleft:5px;
-moz-border-radius-topright:5px;
background-color:#5A6D75;
color:#99aeb8;
font-size:11px;
margin:0;
padding:3px 10px;
}

.boxtitle {
-moz-border-radius-bottomleft:5px;
-moz-border-radius-bottomright:5px;
-moz-border-radius-topleft:5px;
-moz-border-radius-topright:5px;
background-color:#5A6D75;
color:#99aeb8;
display:block;
font-size:11px;
font-weight:bold;
margin:0 0 5px;
padding:3px 10px;
text-align:center;
text-decoration:none;
text-transform:uppercase;
}




   /* MENU NAVIGATION */
   
   .navtop {
   
   top : 0px;
   position : fixed ;
   width : 100% ;
   background-color :#333E43;
   border-bottom : 2px DOTTED #5A6D75;
   border-left : 2px DOTTED #5A6D75;
   text-shadow: #c491ff  2px 2px 4px;
   -moz-border-radius: 20px 10px 10px 10px
   -webkit-border-radius: 20px 10px 10px 10px
   
   }





/* BORDURES*/
   
   /*bordure autour du forum*/

.bodyline {
border: 3px #2e333E solid;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;}




   .bodylinewidth {
   border-right: 10px solid #a79d7e; /*droite*/
   border-left: 10px solid #a79d7e; /*gauche*/
   border-TOP: 0px solid #9bbac5; /*gauche*/
   border-BOTTOM: 0px solid #9bbac5; /*gauche*/
   border-color: #131313;
   -moz-border-radius: 0px 0px 0px 0px;
   -webkit-border-radius: 0px 0px 0px 0px;
   }




.forumline{
-moz-border-radius-bottomleft:5px;
-moz-border-radius-bottomright:5px;
-moz-border-radius-topleft:5px;
-moz-border-radius-topright:5px;

border-bottom: 4px #202b43 solid;
border-left: 2px #202b43solid;
border-right: 2px #202b43 solid;}








   
   
   /* ------------------TEXTE EN BLOC ------------------  */
   
   
.postbody {padding-left:50px; display: block; text-align:justify;}

   
   
   
   /* ------------------CATEGORIE EN MAJUSCULES ------------------  */
   
   h3.hierarchy .forumlink, h2.hierarchy .forumlink{
   font-variant: small-caps;
   font-size: 15px;
   }




   /* ------------------LIENS SOUS FORUM ITALIQUE ------------------  */
   
   .row1.over span.gensmall {font-style: italic !important;}
   
   
   
   /* ------------------PSEUDO EN MINUSCULE / RETRAIT SOULIGNEMENT------------------  */
   
   
   a {text-transform: lowercase ;}
   a:hover {text-decoration: none !important;}
   
   

   /* ------------------TEXTE EN BLOC ------------------  */
   

   .postbody { display: block; padding-left: 30px; padding-RIGHT: 30px; }



   /* ------------------RETRAIT SOULIGNEMENT CONTOUR FORuM------------------  */
   a {
   outline: none;
   }
   



   
   /* ------------------SUPPRIMER LES SOULIGNEMENTS------------------  */
   
   a {text-decoration: none;}
   



   /* ------------------MARGES-----------------  */
   /*supprimer la marge du bas et du haut*/
   body{margin-top: 0px;}
   
   body{margin-bottom: 0px;}
   
   
   
   /* ------------------arrondis zone de texte--------------  */
   
   
   input,textarea, select {border-radius: 10px 10px; -moz-border-radius: 10px;}
   
   
   
   
   
   /* ----------------suppression derniere modif par-------------------------- */
   tr.post span.gensmall { display: none; }
   
      /* ---------------- arrondir bordures intérieures------------------------- */
   
   
   textarea, .textarea.post, input.post {
   -moz-border-radius:10px;
   -webkit-border-radius: 10px;
   }
   

   


   /* ---------------- fond avatar ------------------------ */
   
   
   
   .profilentour {
   
   text-align:justify;
   padding:9px;
   background-color : #none ;
        background-image: url('http://i44.servimg.com/u/f44/11/74/97/65/fond13.png');
   border-TOP : 1px dashed #790000 ;
   border-BOTTOM : 1px Dotted #790000;
   border-LEFT : 1px dashed #790000;
   border-RIGHT : 1px dashed #790000;
        -moz-border-radius-bottomleft:5px;
-moz-border-radius-bottomright:5px;
-moz-border-radius-topleft:5px;
-moz-border-radius-topright:5px;
   
   font-size :15px; }
   








   
   /* ------------------CLASSE TEXTE ------------------  */
   
   .drago
    {
   font-size: 20px;
   text-transform : uppercase ;
   font-family : courrier;
   display:block;
   background-color: #none;
   border-bottom: 4px dotted #dff887;
   text-align : center ;
   position : relative ;
   letter-spacing : 2px ;
   text-shadow: #84654a 2px 2px 2px;
   color:#7b6c3e;
   
   }


   .drago:hover{
   
   color:#c4a852;
   
   }
   
   .orion {
   
   
   font-size:15px;
   text-transform : uppercase ;
   font-family : courrier;
   display:block;
   background-color: #none;
   border-bottom: 2px dashed #741a1a;
   text-align : center ;
   position : relative ;
   letter-spacing : 2px ;
   text-shadow: #b5e299 2px 2px 2px;
   color:#88483c;
   }
   

   .circé{

   
   font-size:12px;
   font-family : courrier;
   display:block;
   background-color: #none;
   text-align : justify ;
   position : relative ;
   letter-spacing : 2px ;
   text-shadow: #ba312d1px 1px 1px;
   color:#674f3c;
   }
   
   .harry{
   font-size: 20px;
   text-transform : uppercase ;
   font-family : courrier;
   display:block;
   background-color: #none;
   border-bottom: 4px dotted #ba312d;
   text-align : center ;
   position : relative ;
   letter-spacing : 2px ;
   text-shadow: #eb9e52 2px 2px 2px;
   color:#a75f5e;
   
   }




   .harry:hover{
   
   color:#eb9e52;
   
   }


   .ron{
   
   font-size:15px;
   text-transform : uppercase ;
   font-family : courrier;
   display:block;
   background-color: #none;
   border-bottom: 1px dotted #9af068;
   text-align : center ;
   position : relative ;
   letter-spacing : 2px ;
   text-shadow: #B05858 2px 2px 2px;
   color:#FFA34F;
   
   }



   .mione{
   
   font-size:12px;
   font-style: italic
   font-family : courrier;
   display:block;
   background-color: #none;
   border-bottom: 1px dashed #e46c54;
   text-align : justify ;
   position : relative ;
   letter-spacing : 2px ;
   text-shadow: #ad879a 2px 2px 2px;
   color:#e6ee5e;
   
   }




   /* ------------------code, citation,spoiler ------------------  */


   
   .code {
   background-image: url('http://i44.servimg.com/u/f44/11/74/97/65/code10.jpg');
   margin-left: 10px;
   margin-top: 10px;
   padding: 2px;
   border-top : 1px  dotted #f6d046;
   border-bottom :1px  dotted #f6d046;
   border-left : 2px  solid #f6d046;
   border-right : 2px  solid #f6d046 ;
   -moz-border-radius : 5px 10px 5px 10px;
   -webkit-border-radius: 5px 10px 5px 10px
   color:#FFFFFF;
   }
   
   .quote{
   background-image: url('http://i44.servimg.com/u/f44/11/74/97/65/quote_11.jpg');
   margin-left: 10px;
   margin-top: 10px;
   padding: 2px;
   border-top : 1px  dashed #b77d3f;
   border-bottom :1px  dashed #b77d3f;
   border-left : 2px dashed #b77d3f;
   border-right : 2px  dashed #b77d3f ;
   -moz-border-radius : 5px 10px 5px 10px;
   -webkit-border-radius: 5px 10px 5px 10px;
   color:#604626;
   }



   /* ------------------SPOILER------------------  */



        .spoiler {
      width:420px;border-spacing:0px;
      background: url('http://i44.servimg.com/u/f44/11/74/97/65/spoile12.png') ;
      background-repeat: no-repeat;  }

      .spoiler tr {
      height:200px; }

      .spoiler tr+tr {
      height:200px;
      background: url('http://i44.servimg.com/u/f44/11/74/97/65/base_s10.png');
      background-repeat: no-repeat;  }

    .spoiler_content{
    background-image: url("http://i44.servimg.com/u/f44/11/74/97/65/quote_11.jpg");  /* Mettre un fond */
    border: 2px #415272 solid;  /* Mettre une bordure */
    border-radius: 10px;  /* Mettre des arrondis */
    -moz-border-radius: 10 px.
    color: #couleur; /* Changer la couleur du texte */
                              }


      .spoiler_closed,.spoiler_closed.hidden,.spoiler_content,.spoiler_content.hidden{
      border:transparent;border-style:none;border-width:0px;}



   /* ------------------class fiche personnage------------------  */

   
   .sirius{
   
   -moz-border-radius-bottomleft:25px;
   -moz-border-radius-bottomright:45px;
   -moz-border-radius-topleft:45px;
   -moz-border-radius-topright:25px;
   background-color:#e8d0dc;
   background: url(none');
   color:#8C3466;
   font-size:11px;
   margin-left:5
   padding:3px 10px;
   border-TOP : 2px solid #fcc48f ;
   border-BOTTOM : 2px Dashed #fcc48f ;
   border-LEFT : 4px solid #fcc48f ;
   border-RIGHT : 4px solid #fcc48f;
   display:block;
   }
   
   

/* -----------------opacité------------------  */

/* opacité des images */
img:hover {opacity:0.8;
filter:alpha(opacity=75);
-moz-opacity:0.8;
-khtml-opacity:0.8;}

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



/* -----------------effet lumineux-----------------  */


#text-shadow {
    text-shadow: #555 4px 4px 4px;
}

a:hover /* par défaut: halo blanc */
{
 text-shadow: white 0px 0px 4px;
}
a.forumlink:hover /* pour les liens des titres : halo doré */
{
  text-shadow: #d2b419 0px 0px 4px;
}

   /* ------------------LIENS et UTILISATEURS  ------------------  */
   
   
   a:link {text-transform: lowercase; letter-spacing: 2px;}
   a:visited {text-transform: lowercase; letter-spacing: 2px;}
   a:hover {text-transform: lowercase; letter-spacing: 2px;
    text-shadow: white 4px 0px 0px 4px;}
   a:active {text-transform: lowercase; letter-spacing: 2px;}
        a { text-decoration: none; }





   /* ------------------catégorie----------------  */

td.row1,td.row3.over:hover {
    background-color: #5D5F62;
        background-image: url("");
    }
td.row2,td.row1.over:hover {
    background-color: #;
        background-image: url("");
    }
td.row3{
    background-color: #131313;
        background-image: url("");
    }
td.rowpic {
   background-color: #131313;
   background-image: url("");
   css}
th {
   color: #none;
   font-size: 11px;
   font-weight : bold;
   background-color: #131313;
   height: 25px;
   background-image: url("");
   padding: 2px 3px;
   }
td.cat,td.catHead,td.catSides,td.catLeft,td.catRight,td.catBottom {
   background-image: url("");
   background-color:#131313;
    border: #ed1f86;
    border-style: solid;
    height: 28px;
   }



.mainmenu {

text-transform: uppercase;

font-size: 18px!important;

font-family: times new roman;

letter-spacing: -1px;

margin-left: 10px;

line-height: normal;

}



.mainmenu:hover {

text-transform: uppercase;

font-size: 18px!important;

font-family: times new roman;

letter-spacing: -1px;

margin-left: 10px;

line-height: normal;



}


/* -----------------soulignement---------------  */




[SoraNoHime]

Pour le titre, remplace :

Code:

  <tr>
<div style="background-image : url(http://i44.servimg.com/u/f44/11/74/97/65/haut_c11.png) ; background-repeat : no-repeat ; width : 759px ; height : 121px"><div class="catégoz">{catrow.tablehead.L_FORUM}</div></div>
 
 
            </td><td class="genmed" nowrap="nowrap" width="150" align="center"><div style="width:150px;"><strong>{L_LASTPOST}</strong></div></td>
                        </tr>
                        <!-- END tablehead -->

par

Code:

  <tr>
<div style="background-image : url(http://i44.servimg.com/u/f44/11/74/97/65/haut_c11.png) ; background-repeat : no-repeat ; width : 759px ; height : 121px"><div class="catégoz">{catrow.tablehead.L_FORUM}</div></div>
 
 
            </td><td class="genmed" nowrap="nowrap" width="150" align="center"><div style="width:150px;"><strong>{L_LASTPOST}</strong></div></td>
                        </tr>
                        <!-- END tablehead -->

cela va déjà remettre comme il faut l'image du titre, puis normal que ton image dans dernier sujet apparaisse deux fois. tu as déjà la class="cadredulast", supprime en une ^^

Ensuite, enlève le class="forumline" que tu trouves dans le code des onglets. je t'expliquerai ensuite comment remettre le tour.

[Alec Turner]

ici alors ?

Code:

 <div class="cadredulast"><span class="gensmall">{catrow.forumrow.LAST_POST}</div><div class="cadredulast">
    {catrow.forumrow.POSTS} Messages dans {catrow.forumrow.TOPICS} Sujets</div></span>
          </div></td>

par contre pour le forumline désolé je n'ai pas compris

[SoraNoHime]

oui tu as deux class="cadredulast" d'où le doublet de l'image dans dernier message. Il faut que tu en enlèves un.

Pour le class="forumline" regarde dans la partie modification des onglets. Tu en as deux. Il faut les enlever. Puis je t'indiquerai comment remettre un tour à la partie des forums ^^

[Alec Turner]

j'ai réussi a modifier le dernier message, cependant le titre de la colonne est a gauche >_<
pour le dessus les deux forumline, je n'y arrive pas par contre, j'ai essayé mais je plante le tout

[SoraNoHime]

Puis-je réavoir votre template ?

[Alec Turner]

Code:

        <table width="100%" border="0" cellspacing="1" cellpadding="0" align="center">
        <tr>
        <td valign="bottom">
        <!-- BEGIN switch_user_logged_in -->

        </span>
        <!-- END switch_user_logged_in -->

        </td>
        <td class="gensmall" align="right" valign="bottom">
        <!-- BEGIN switch_user_logged_in -->
        <!-- END switch_user_logged_in -->
        </td>
        </tr>
        </table>



        <!-- DEBUT MODIF ONGLETS -->


        <script type="text/javascript">
            <!--

            document.write('<div align=&quot;center&quot; style=&quot;display:none;&quot; id=&quot;conteneur_barre_onglet&quot;>
            <ul class=&quot;conteneur_onglets&quot;>

            <li onClick=&quot;change_cat(1)&quot; class=&quot;onglet actif&quot; id=&quot;onglet_1&quot;>Le Blabla Habituel </li>
        </ul><ul>
            <li onClick=&quot;change_cat(2)&quot; class=&quot;onglet &quot; id=&quot;onglet_2&quot;>Personnages</li>
        </ul><ul>
            <li onClick=&quot;change_cat(3)&quot; class=&quot;onglet &quot; id=&quot;onglet_3&quot;>Vies et Personnages</li>
        </ul><ul>
            <li onClick=&quot;change_cat(4)&quot; class=&quot;onglet &quot; id=&quot;onglet_4&quot;>Paris </li>
        </ul><ul>
            <li onClick=&quot;change_cat(5)&quot; class=&quot;onglet &quot; id=&quot;onglet_5&quot;>The Free Zone</li>

            </ul></div>');

            var compteur_cat = 1;

            function change_cat(numero)
            {
              if(document.getElementById('categorie_'+numero))
              {
                  /* affichage de la bonne categorie */
                  $('table[id^=categorie_]').css('display','none');
                  $('table[id=categorie_'+numero+']').fadeIn();
             
                  /* affichage du bon onglet */
                  $('.actif').removeClass(&quot;actif&quot;);
                  $('.onglet[id=onglet_'+numero+']').addClass(&quot;actif&quot;);
              }
            }

            function capture_cat()
            {
              if(compteur_cat == 1)
              {
                  document.write('<table class=&quot;forumline&quot; id=&quot;categorie_' + compteur_cat + '&quot; >');
              }
              else
              {
                  $('#conteneur_barre_onglet').css(&quot;display&quot;,&quot;block&quot;);
                  document.write('<table class=&quot;forumline&quot; id=&quot;categorie_' + compteur_cat + '&quot; style=&quot;display:none;&quot;>');
              }
         
              compteur_cat++;
            }

            //-->
            </script>


            <!-- BEGIN catrow --><!-- BEGIN tablehead -->


          <script type="text/javascript">
            <!--
              capture_cat();
            //-->
            </script>

            <!-- FIN MODIF ONGLETS -->



          <tr>
      <div style="background-image : url(http://i44.servimg.com/u/f44/11/74/97/65/haut_c11.png) ; background-repeat : no-repeat ; width : 759px ; height : 121px"><div class="catégoz">{catrow.tablehead.L_FORUM}</div></div>
       
       
      </td><td class="genmed" nowrap="nowrap" width="150" align="center"><div style="width:150px;"><strong>{L_LASTPOST}</strong></div></td>
                              </tr>
                                <!-- END tablehead -->
                        <!-- BEGIN cathead -->



        <tr>

        <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 -->
     

  <tr><td colspan="3" height="1"class="espace1"> </td></tr><tr>
          <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>
        <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>

        </span>
        </h{catrow.forumrow.LEVEL}>

        <div class="descriptionforums"><span class="genmed">{catrow.forumrow.FORUM_DESC}</span>
      <span class="gensmall">

 </div><div class="forum-stats"><span class="gensmall">{catrow.forumrow.POSTS} parchemins et {catrow.forumrow.TOPICS} hiboux</div></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></div>
        </span>
        </td>
        <!-- BEGIN forum_link_no -->
<td class="row3 over" align="center" valign="top" height="1%"><div style="width :100%;">
            <div class="cadredulast"><span class="gensmall">{catrow.forumrow.LAST_POST}
    {catrow.forumrow.POSTS} Messages dans {catrow.forumrow.TOPICS} Sujets</div></span>
          </div></td>


        <!-- 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 -->
        </tr>
  </tr>  <tr><td colspan="3" height="1"class="espace2"> </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 -->

voila voila

[SoraNoHime]

Vous n'avez pas fait la modifications que je vous avez donné ^^

Pour le titre, remplace :

Code:

  <tr>
<div style="background-image : url(http://i44.servimg.com/u/f44/11/74/97/65/haut_c11.png) ; background-repeat : no-repeat ; width : 759px ; height : 121px"><div class="catégoz">{catrow.tablehead.L_FORUM}</div></div>
 
 
            </td><td class="genmed" nowrap="nowrap" width="150" align="center"><div style="width:150px;"><strong>{L_LASTPOST}</strong></div></td>
                        </tr>
                        <!-- END tablehead -->

par

Code:

  <tr>
<div style="background-image : url(http://i44.servimg.com/u/f44/11/74/97/65/haut_c11.png) ; background-repeat : no-repeat ; width : 759px ; height : 121px"><div class="catégoz">{catrow.tablehead.L_FORUM}</div></div>
 
 
            </td><td class="genmed" nowrap="nowrap" width="150" align="center"><div style="width:150px;"><strong>{L_LASTPOST}</strong></div></td>
                        </tr>
                        <!-- END tablehead -->

cela va déjà remettre comme il faut l'image du titre

[Alec Turner]

ben si je l'ai fait deux fois meme

[SoraNoHime]

oups c'est de ma faute, j'ai pas eu le bon copier coller :

ceci est le bon code à mettre à la place.

Code:

 <tr><td>
        <div style="background-image : url(http://i44.servimg.com/u/f44/11/74/97/65/haut_c11.png) ; background-repeat : no-repeat ; width : 759px ; height : 121px"><div class="catégoz">{catrow.tablehead.L_FORUM}</div></div>       
                    </td>
                                </tr>
                                <!-- END tablehead -->

[Alec Turner]

tu vas me prendre pour une folle mais ca a tout déformé

[SoraNoHime]

Voici ce à quoi 'arrive pour ma part ici

peux-tu me rendre ton index_box ?

[Alec Turner]

Code:

        <table width="100%" border="0" cellspacing="1" cellpadding="0" align="center">
        <tr>
        <td valign="bottom">
        <!-- BEGIN switch_user_logged_in -->

        </span>
        <!-- END switch_user_logged_in -->

        </td>
        <td class="gensmall" align="right" valign="bottom">
        <!-- BEGIN switch_user_logged_in -->
        <!-- END switch_user_logged_in -->
        </td>
        </tr>
        </table>



        <!-- DEBUT MODIF ONGLETS -->


        <script type="text/javascript">
            <!--

            document.write('<div align=&quot;center&quot; style=&quot;display:none;&quot; id=&quot;conteneur_barre_onglet&quot;>
            <ul class=&quot;conteneur_onglets&quot;>

            <li onClick=&quot;change_cat(1)&quot; class=&quot;onglet actif&quot; id=&quot;onglet_1&quot;>Le Blabla Habituel </li>
        </ul><ul>
            <li onClick=&quot;change_cat(2)&quot; class=&quot;onglet &quot; id=&quot;onglet_2&quot;>Personnages</li>
        </ul><ul>
            <li onClick=&quot;change_cat(3)&quot; class=&quot;onglet &quot; id=&quot;onglet_3&quot;>Vies et Personnages</li>
        </ul><ul>
            <li onClick=&quot;change_cat(4)&quot; class=&quot;onglet &quot; id=&quot;onglet_4&quot;>Paris </li>
        </ul><ul>
            <li onClick=&quot;change_cat(5)&quot; class=&quot;onglet &quot; id=&quot;onglet_5&quot;>The Free Zone</li>

            </ul></div>');

            var compteur_cat = 1;

            function change_cat(numero)
            {
              if(document.getElementById('categorie_'+numero))
              {
                  /* affichage de la bonne categorie */
                  $('table[id^=categorie_]').css('display','none');
                  $('table[id=categorie_'+numero+']').fadeIn();
             
                  /* affichage du bon onglet */
                  $('.actif').removeClass(&quot;actif&quot;);
                  $('.onglet[id=onglet_'+numero+']').addClass(&quot;actif&quot;);
              }
            }

            function capture_cat()
            {
              if(compteur_cat == 1)
              {
                  document.write('<table class=&quot;forumline&quot; id=&quot;categorie_' + compteur_cat + '&quot; >');
              }
              else
              {
                  $('#conteneur_barre_onglet').css(&quot;display&quot;,&quot;block&quot;);
                  document.write('<table class=&quot;forumline&quot; id=&quot;categorie_' + compteur_cat + '&quot; style=&quot;display:none;&quot;>');
              }
         
              compteur_cat++;
            }

            //-->
            </script>


            <!-- BEGIN catrow --><!-- BEGIN tablehead -->


          <script type="text/javascript">
            <!--
              capture_cat();
            //-->
            </script>

            <!-- FIN MODIF ONGLETS -->



          <tr><td>
          <div style="background-image : url(http://i44.servimg.com/u/f44/11/74/97/65/haut_c11.png) ; background-repeat : no-repeat ; width : 759px ; height : 121px"><div class="catégoz">{catrow.tablehead.L_FORUM}</div></div>     
          </td>
          </tr>
          <!-- END tablehead -->

                        <!-- BEGIN cathead -->



        <tr>

        <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 -->
     

  <tr><td colspan="3" height="1"class="espace1"> </td></tr><tr>
          <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>
        <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>

        </span>
        </h{catrow.forumrow.LEVEL}>

        <div class="descriptionforums"><span class="genmed">{catrow.forumrow.FORUM_DESC}</span>
      <span class="gensmall">

 </div><div class="forum-stats"><span class="gensmall">{catrow.forumrow.POSTS} parchemins et {catrow.forumrow.TOPICS} hiboux</div></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></div>
        </span>
        </td>
        <!-- BEGIN forum_link_no -->
<td class="row3 over" align="center" valign="top" height="1%"><div style="width :100%;">
            <div class="cadredulast"><span class="gensmall">{catrow.forumrow.LAST_POST}
    {catrow.forumrow.POSTS} Messages dans {catrow.forumrow.TOPICS} Sujets</div></span>
          </div></td>


        <!-- 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 -->
        </tr>
  </tr>  <tr><td colspan="3" height="1"class="espace2"> </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 -->

je ne comprend pas il me semble avoir suivi ton instruction à la lettre >_>

[SoraNoHime]

Il suffit d'une erreur de copier coller ^^

Il y a une différence de fermeture de tableau et tous tes " se sont tranformés en code

Code:

"

. remet les.

repére ceci :

Code:

 <div class="cadredulast"><span class="gensmall">{catrow.forumrow.LAST_POST}
            {catrow.forumrow.POSTS} Messages dans {catrow.forumrow.TOPICS} Sujets</div></span>
                  </div></td>


et ajoute à la fin

Code:

</tr></table></td>

de plus ici :

Code:

document.write('<table class=&quot;forumline&quot; id=&quot;categorie_' + compteur_cat + '&quot; >');
              }
              else
              {
                  $('#conteneur_barre_onglet').css(&quot;display&quot;,&quot;block&quot;);
                  document.write('<table class=&quot;forumline&quot; id=&quot;categorie_' + compteur_cat + '&quot; style=&quot;display:none;&quot;>');
              }

tu n'as pas enlever les class="forumline" ^^ y'en a deux.

[Alec Turner]

bon les "" je les ai remis, a peine le template enregistré qu'il remet ces quote j'ai modifié le cadre du last j'ai ajouté le table

par contre comme je te l'ai fait remarqué au tout début je n'arrive pas a modifier les deux forumline

[SoraNoHime]

Essaie de mettre mon rendu actuel à la place :

Code:

            <table width="100%" border="0" cellspacing="1" cellpadding="0" align="center">
                <tr>
                <td valign="bottom">
                <!-- BEGIN switch_user_logged_in -->
       
                </span>
                <!-- END switch_user_logged_in -->
       
                </td>
                <td class="gensmall" align="right" valign="bottom">
                <!-- BEGIN switch_user_logged_in -->
                <!-- END switch_user_logged_in -->
                </td>
                </tr>
                </table>
       
       
       
                <!-- DEBUT MODIF ONGLETS -->
       
       
                <script type="text/javascript">
                    <!--
       
                    document.write('<div align="center" style="display:none;" id="conteneur_barre_onglet">
                    <ul class="conteneur_onglets">
       
                    <li onClick="change_cat(1)" class="onglet actif" id="onglet_1">Le Blabla Habituel </li>
                </ul><ul>
                    <li onClick="change_cat(2)" class="onglet " id="onglet_2">Personnages</li>
                </ul><ul>
                    <li onClick="change_cat(3)" class="onglet " id="onglet_3">Vies et Personnages</li>
                </ul><ul>
                    <li onClick="change_cat(4)" class="onglet " id="onglet_4">Paris </li>
                </ul><ul>
                    <li onClick="change_cat(5)" class="onglet " id="onglet_5">The Free Zone</li>
       
                    </ul></div>');
       
                    var compteur_cat = 1;
       
                    function change_cat(numero)
                    {
                      if(document.getElementById('categorie_'+numero))
                      {
                          /* affichage de la bonne categorie */
                          $('table[id^=categorie_]').css('display','none');
                          $('table[id=categorie_'+numero+']').fadeIn();
                   
                          /* affichage du bon onglet */
                          $('.actif').removeClass("actif");
                          $('.onglet[id=onglet_'+numero+']').addClass("actif");
                      }
                    }
       
                    function capture_cat()
                    {
                      if(compteur_cat == 1)
                      {
                          document.write('<table id="categorie_' + compteur_cat + '" >');
                      }
                      else
                      {
                          $('#conteneur_barre_onglet').css("display","block");
                          document.write('<table id="categorie_' + compteur_cat + '" style="display:none;">');
                      }
               
                      compteur_cat++;
                    }
       
                    //-->
                    </script>
       
       
                    <!-- BEGIN catrow --><!-- BEGIN tablehead -->
       
       
                  <script type="text/javascript">
                    <!--
                      capture_cat();
                    //-->
                    </script>
       
                    <!-- FIN MODIF ONGLETS -->
       
       
                  <tr><td>
        <div style="background-image : url(http://i44.servimg.com/u/f44/11/74/97/65/haut_c11.png) ; background-repeat : no-repeat ; width : 759px ; height : 121px"><div class="catégoz">{catrow.tablehead.L_FORUM}</div></div>
       
       
                    </td>
                                </tr>
                                <!-- END tablehead -->
                                <!-- BEGIN cathead -->
       
       
       
                <tr>
       
                <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><td class="forumline"><table width="100%" cellspacing="0" cellpading="0"><tr>
                <!-- BEGIN inc -->
                <td class="{catrow.forumrow.inc.INC_CLASS}" width="46"><img src="{SPACER}" height="0" width="46" alt="." /></td>
                <!-- END inc -->
           
       
          <tr><td colspan="3" height="1"class="espace1"> </td></tr><tr>
                  <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>
                <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>
       
                </span>
                </h{catrow.forumrow.LEVEL}>
       
                <div class="descriptionforums"><span class="genmed">{catrow.forumrow.FORUM_DESC}</span>
              <span class="gensmall">
       
        </div><div class="forum-stats"><span class="gensmall">{catrow.forumrow.POSTS} parchemins et {catrow.forumrow.TOPICS} hiboux</div></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></div>
                </span>
                </td>
                <!-- BEGIN forum_link_no -->
        <td class="row3 over" align="center" valign="top" height="1%"><div style="width :100%;">
                    <div class="cadredulast"><span class="gensmall">{catrow.forumrow.LAST_POST}
            {catrow.forumrow.POSTS} Messages dans {catrow.forumrow.TOPICS} Sujets</div></span>
                  </div></td></tr></table></td>
       
       
                <!-- 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 -->
                </tr>
          </tr>  <tr><td colspan="3" height="1"class="espace2"> </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 -->

[Alec Turner]

ah ca fonctionne. J'avoue ne pas comprendre macema, tes explications sont claires ( excepte le forumline mais c'est moi qui ne comprend pas) qu'est ce qui ne fonctionne pas. comment puis je retirer le px qui les sépare?

Normalement je suis arrivée au bout de ce topic, excepté le px, je te remercie de ton aide, tu as beaucoup de patience

[SoraNoHime]

Pour l'espace nous allons revoir le div contenant et le titre, et l'image

repère :

Code:

<div style="background-image : url(http://i44.servimg.com/u/f44/11/74/97/65/haut_c11.png) ; background-repeat : no-repeat ; width : 759px ; height : 121px"><div class="catégoz">{catrow.tablehead.L_FORUM}</div></div>

et change le en :

Code:

<div class="categoz">{catrow.tablehead.L_FORUM}</div>

et remplace dans la css .catégoz{...} par :

Code:

.categoz h2{
 width : 759px ;
height : 121px;
text-align : center ;
position : relative ;
top : 15px ;
letter-spacing : 2px ;
}

.categoz {
background-image : url(http://i44.servimg.com/u/f44/11/74/97/65/haut_c11.png);
 background-repeat : no-repeat ;
 width : 759px ;
height : 121px;
text-align : center ;
position : relative ;
top : 15px ;
}

le premier correspond au titre le second au fond ^^

[Alec Turner]

ca fonctionne parfaitement, je me pose cependant une question, est-ce logique que j'ai deux petits traits sur le dessus de la cat? une possible bordure,si oui je chercherai ^-^

[SoraNoHime]

C'est parce que l'image est trop baissée. change dans les codes css que je t'ai donné plus haut les top : 15px; en réduisant les 15.