Image de fond des titres de catégories

[Invité]

Encore moi

J'aimerais savoir comment faire pour faire un fond de titre de catégorie arrondi comme sur ce forum ? Ou au moins savoir comment le modifier.

Merci d'avance

[Arlem]

Bonsoir,

C'est simplement une image avec un arrondi :
http://img186.imageshack.us/img186/8813/sanstitre1vmi.png

[Invité]

J'aimerais savoir où mettre l'image voulu. Dans les templates ? Le CSS ?

[funky17]

P.A > affichage > Gestion des images > mode avancé >

Tu as alors trois champs :

- Image du fond des titres

- Image du fond des catégories (gauche)

- Image du fond des catégories (droite)

C'est l'un de ces trois champs suivant la version de ton forum

++

[Invité]

J'ai repris l'image uniquement pour tester ( elle sera bien entendu enlevée ) mais le problème étant que l'image reste dans la case, qui est trop petite. Peut-être faut-il passer par les templates ou le CSS ?

[funky17]

Non, il te faut harmoniser la largeur de ton forum à la largeur de l'image de fond des titres pour qu'elle rentre pile poil.

Enfin idéalement, d'abord tu fixes la largeur de ton forum, et après tu te fais une image de fond.

++

[Invité]

Le problème n'est pas la largeur mais là hauteur de la case du titre des catégories comme on peut le voir sur le forum.

EDIT. Je viens également de remarquer que l'image s'applique aussi dans les sujets comme vous pouvez le voir ici. && J'aimerais que ça ne s'applique qu'à la case du nom de catégorie.

[Anzu]

Bonsoir,

Non, la modification se fait via le template index_box.

Voilà le code =>

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 width="100%" cellspacing="0px" cellpading="0px"><tr><td class="fondtitres">{catrow.tablehead.L_FORUM}</td><td></td><tr><tr><td colspan="2">

<table class="forumline" width="100%" border="0" cellspacing="1" 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}>
         <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 class="row3" align="center" valign="middle" height="50">
         <span class="gensmall">{catrow.forumrow.TOPICS}</span>
      </td>
      <td class="row2" align="center" valign="middle" height="50">
         <span class="gensmall">{catrow.forumrow.POSTS}</span>
      </td>
      <td class="row3 over" align="center" valign="middle" height="50">
         <span class="gensmall">{catrow.forumrow.LAST_POST}</span>
      </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>
   <!-- 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></td></tr></table><img src="{SPACER}" alt="" height="5" width="1" /><!-- END tablefoot --><!-- END catrow -->

Les explications =>

J'ai supprimé ceci:

Code:

<tr>
      <th colspan="{catrow.tablehead.INC_SPAN}" nowrap="nowrap" width="100%" class="secondarytitle"> {catrow.tablehead.L_FORUM} </th>
      <th nowrap="nowrap" width="50">{L_TOPICS}</th>
      <th nowrap="nowrap" width="50">{L_POSTS}</th>
      <th nowrap="nowrap" width="150"><div style="width:150px;">{L_LASTPOST}</div></th>
   </tr>

Et à la place j'ai mis ce tableau:

Code:

<table width="100%" cellspacing="0px" cellpading="0px"><tr><td class="fondtitres">{catrow.tablehead.L_FORUM}</td><td></td><tr><tr><td colspan="2">

Dans la CSS =>

Code:


.fondtitres{
width: largeur de l'image en px;
height: hauteur de l'image en px;
text-align: center;
align: center;
background: url('lien de l'image') center;
background-repeat: no-repeat;
}

Cordialement.

[Invité]

Merci beaucoup pour votre réponse mais cela ne fonctionne pas. Le problème étant que j'ai déjà modifié certaines choses dans ce template ... ( Catégories en onglets, suppression de certaines colonnes ). Je vous laisse voir ce que ça donne :ici.

Voilà mon template :

Code:

<!-- DEBUT MODIF ONGLETS -->

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

var i = 0;

document.write('<div align="center">
<ul class="onglet">

 
<li onMouseOver="change_cat(0);" class="onglet_actif" id="cat_0">un</li>
<li onMouseOver="change_cat(1);" class="onglet_nactif" id="cat_1">deux</li>
<li onMouseOver="change_cat(2);" class="onglet_nactif" id="cat_2">trois</li>
<li onMouseOver="change_cat(3);" class="onglet_nactif" id="cat_3">quatre</li>
<li onMouseOver="change_cat(4);" class="onglet_nactif" id="cat_4">cinq</li>
<li onMouseOver="change_cat(5);" class="onglet_nactif" id="cat_5">six</li>
<li onMouseOver="change_cat(6);" class="onglet_nactif" id="cat_6">sept</li>
<li onMouseOver="change_cat(7);" class="onglet_nactif" id="cat_7">huit</li>



</ul>
</div>
');

var compteur_cat = 0;

var anc_cat = 0;

var nom_cat = new Array('0','1','2','3','4','5','6','7');

 
function change_cat(numero)
{
 document.getElementById(nom_cat[anc_cat]).style.display = 'none';
 document.getElementById(nom_cat[numero]).style.display = 'block';
 document.getElementById('cat_'+nom_cat[anc_cat]).className = 'onglet_nactif';
 document.getElementById('cat_'+nom_cat[numero]).className ='onglet_actif';
 anc_cat = numero;
}

function capture_cat()
{
if(nom_cat[compteur_cat] == nom_cat[0])
{document.write('<table class="forumline" id="' + nom_cat[compteur_cat] + '" >');
}
else{
 document.write('<table class="forumline" id="' + nom_cat[compteur_cat] + '" style="display:none;">');
}
compteur_cat++;
}

//-->
</script>
<!-- BEGIN catrow --><!-- BEGIN tablehead -->

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

<!-- FIN MODIF ONGLETS -->

<br><table width="100%" cellspacing="0px" cellpading="0px"><tr><td class="fondtitres">{catrow.tablehead.L_FORUM}</td><td></td><tr><tr><td colspan="2">
<!-- 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>

</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>
<td class="row3 over" align="center" valign="middle" height="50">
<span class="gensmall">
<div class="sujets_messages"><b>{catrow.forumrow.TOPICS} sujets</b> | <b>{catrow.forumrow.POSTS} messages</b></div>
<div class="derniers_sujets">{catrow.forumrow.LAST_POST}</div></span>
</td>
<!-- BEGIN forum_link_no -->

<!-- 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>
<!-- 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 -->
<img src="{SPACER}" alt="" height="5" width="1" /><!-- END tablefoot --><!-- END catrow -->


EDIT: Vous pourrez également voir que mes onglets sont toujours là mais que toutes mes catégories sont affichées en dessous .

[Anzu]

Il fallait préciser

Je vous ai donné un template correct, avec l'effet désiré. Si vous avez fait d'autres modifications, vous devez les adapter au code que je vous ai donné.

Après je n'ai jamais testé cet effet avec les catégories en onglet ..

Faut que je regarde de plus près, mais je vous invite à essayer quand même de votre côté en faisant les choses dans l'ordre

Cordialement.

[Invité]

Ca fait un petit moment que j'y suis, j'ai recommencé plusieurs fois ... mais je ne trouve pas de solutions.
J'ai suis même revenue au template par défaut, histoire de voir si c'était les onglets qui étaient en cause mais les modifications apportées ne me donne pas l'effet voulu.

Voilà mon template actuel :

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="1" cellpadding="0">
   <table width="100%" cellspacing="0px" cellpading="0px"><tr><td class="fondtitres">{catrow.tablehead.L_FORUM}</td><td></td><tr><tr><td colspan="2">
   <!-- 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}>
         <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 class="row3" align="center" valign="middle" height="50">
         <span class="gensmall">{catrow.forumrow.TOPICS}</span>
      </td>
      <td class="row2" align="center" valign="middle" height="50">
         <span class="gensmall">{catrow.forumrow.POSTS}</span>
      </td>
      <td class="row3 over" align="center" valign="middle" height="50">
         <span class="gensmall">{catrow.forumrow.LAST_POST}</span>
      </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>
   <!-- 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 -->

[Invité]

Je me permet un UP.

[Invité]

Je me permet un UP.

[Invité]

Nouveau UP

[Anzu]

Bonsoir,

Il me faudrait les codes que vous avez utilisés pour faire vos onglets SANS la modification que je vous ai donné pour l'index box.

Je vais tenter d'appliquer la modification que je vous ai donnée aux catégories en onglets.

Cordialement.

[Invité]

Merci pour votre réponse.

Voici le template.

Code:

<!-- DEBUT MODIF ONGLETS -->

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

var i = 0;

document.write('<div align=&quot;center&quot;>
<ul class=&quot;onglet&quot;>

 
<li onMouseOver=&quot;change_cat(0);&quot; class=&quot;onglet_actif&quot; id=&quot;cat_0&quot;>un</li>
<li onMouseOver=&quot;change_cat(1);&quot; class=&quot;onglet_nactif&quot; id=&quot;cat_1&quot;>deux</li>
<li onMouseOver=&quot;change_cat(2);&quot; class=&quot;onglet_nactif&quot; id=&quot;cat_2&quot;>trois</li>
<li onMouseOver=&quot;change_cat(3);&quot; class=&quot;onglet_nactif&quot; id=&quot;cat_3&quot;>quatre</li>
<li onMouseOver=&quot;change_cat(4);&quot; class=&quot;onglet_nactif&quot; id=&quot;cat_4&quot;>cinq</li>
<li onMouseOver=&quot;change_cat(5);&quot; class=&quot;onglet_nactif&quot; id=&quot;cat_5&quot;>six</li>
<li onMouseOver=&quot;change_cat(6);&quot; class=&quot;onglet_nactif&quot; id=&quot;cat_6&quot;>sept</li>
<li onMouseOver=&quot;change_cat(7);&quot; class=&quot;onglet_nactif&quot; id=&quot;cat_7&quot;>huit</li>



</ul>
</div>
');

var compteur_cat = 0;

var anc_cat = 0;

var nom_cat = new Array('0','1','2','3','4','5','6','7');

 
function change_cat(numero)
{
 document.getElementById(nom_cat[anc_cat]).style.display = 'none';
 document.getElementById(nom_cat[numero]).style.display = 'block';
 document.getElementById('cat_'+nom_cat[anc_cat]).className = 'onglet_nactif';
 document.getElementById('cat_'+nom_cat[numero]).className ='onglet_actif';
 anc_cat = numero;
}

function capture_cat()
{
if(nom_cat[compteur_cat] == nom_cat[0])
{document.write('<table class=&quot;forumline&quot; id=&quot;' + nom_cat[compteur_cat] + '&quot; >');
}
else{
 document.write('<table class=&quot;forumline&quot; id=&quot;' + nom_cat[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 -->

<br><tr>
      <th colspan="{catrow.tablehead.INC_SPAN}" nowrap="nowrap" width="100%" class="secondarytitle"> {catrow.tablehead.L_FORUM} </th>
      <th nowrap="nowrap" width="150"><div style="width:150px;">{L_LASTPOST}</div></th>
  </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}">{catrow.forumrow.FORUM_NAME}</a>

</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>
<td class="row3 over" align="center" valign="middle" height="50">
<span class="gensmall">
<div class="sujets_messages"><b>{catrow.forumrow.TOPICS} sujets</b> | <b>{catrow.forumrow.POSTS} messages</b></div>
<div class="derniers_sujets">{catrow.forumrow.LAST_POST}</div></span>
</td>
<!-- BEGIN forum_link_no -->

<!-- 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>
<!-- 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 -->
<img src="{SPACER}" alt="" height="5" width="1" /><!-- END tablefoot --><!-- END catrow -->

&& le CSS des onglets . Je ne sais pas si ce sera utile mais je vous le mets quand même.

Code:

.text {
color:#FFFFFF; /*Couleur du texte de vos onglets*/
cursor:pointer;
}

#cat_un,#cat_deux,#cat_trois,#cat_quatre,#cat_cinq,#cat_six,#cat_sept,#cat_huit /*Noms des onglets*/ {
padding-top:4px;
}

.spoiler_content { display: block; }
.hidden .spoiler_content { display: none; }

.cat_forum {
background-color: #000000;
margin: auto;
margin-bottom:30px;
width:800px;
}

.onglet {
display:inline-block;
margin-top:30px;
text-decoration:none; !important
cursor:pointer;
}

.onglet li {
float:left;
list-style-type:none;
margin-bottom:-22px;
text-decoration:none; !important
cursor:pointer;
}

.onglet li:hover {
text-decoration:none; !important
cursor:pointer;
}

.onglet li a {
display:block;
text-decoration:none; !important
list-style-type: none;
cursor:pointer;
}

.onglet li a: hover {
text-decoration:none;
list-style-type:none;
cursor:pointer;
}

.onglet_actif {
background-color : #FF0000; /*Couleur de l'onglet étant actif*/
width:40px; /*Largeur de l'onglet étant actif*/
height:10px; /*Hauteur de l'onglet étant actif*/
cursor:pointer;
color: #000000; /*Couleur du texte*/
font-style: normal; /*Police d'écriture*/
font-size: 10px; /*Taille du texte*/
padding: 5px; /*Pas de chevauchement des onglets*/
margin: 5px; /*Espace entre les onglets*/
}

.onglet_nactif {
background-color : #FF0000; /*Couleur de l'onglet étant inactif*/
width:40px; /*Largeur de l'onglet étant inactif*/
height:10px; /*Hauteur de l'onglet étant inactif*/
cursor:pointer;
color: #000000; /*Couleur du texte*/
font-style: normal; /*Police d'écriture*/
font-size: 10px; /*Taille du texte*/
padding: 5px; /*Pas de chevauchement des onglets*/
margin: 5px; /*Espace entre les onglets*/
}

[Anzu]

Bonjour,

Code:


<!-- DEBUT MODIF ONGLETS -->

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

var i = 0;

document.write('<div align=&quot;center&quot;>
<ul class=&quot;onglet&quot;>

 
<li onMouseOver=&quot;change_cat(0);&quot; class=&quot;onglet_actif&quot; id=&quot;cat_0&quot;>un</li>
<li onMouseOver=&quot;change_cat(1);&quot; class=&quot;onglet_nactif&quot; id=&quot;cat_1&quot;>deux</li>
<li onMouseOver=&quot;change_cat(2);&quot; class=&quot;onglet_nactif&quot; id=&quot;cat_2&quot;>trois</li>
<li onMouseOver=&quot;change_cat(3);&quot; class=&quot;onglet_nactif&quot; id=&quot;cat_3&quot;>quatre</li>
<li onMouseOver=&quot;change_cat(4);&quot; class=&quot;onglet_nactif&quot; id=&quot;cat_4&quot;>cinq</li>
<li onMouseOver=&quot;change_cat(5);&quot; class=&quot;onglet_nactif&quot; id=&quot;cat_5&quot;>six</li>
<li onMouseOver=&quot;change_cat(6);&quot; class=&quot;onglet_nactif&quot; id=&quot;cat_6&quot;>sept</li>
<li onMouseOver=&quot;change_cat(7);&quot; class=&quot;onglet_nactif&quot; id=&quot;cat_7&quot;>huit</li>



</ul>
</div>
');

var compteur_cat = 0;

var anc_cat = 0;

var nom_cat = new Array('0','1','2','3','4','5','6','7');

 
function change_cat(numero)
{
 document.getElementById(nom_cat[anc_cat]).style.display = 'none';
 document.getElementById(nom_cat[numero]).style.display = 'block';
 document.getElementById('cat_'+nom_cat[anc_cat]).className = 'onglet_nactif';
 document.getElementById('cat_'+nom_cat[numero]).className ='onglet_actif';
 anc_cat = numero;
}

function capture_cat()
{
if(nom_cat[compteur_cat] == nom_cat[0])
{document.write('<table class=&quot;forumline&quot; id=&quot;' + nom_cat[compteur_cat] + '&quot; >');
}
else{
 document.write('<table class=&quot;forumline&quot; id=&quot;' + nom_cat[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 class="fondtitres">{catrow.tablehead.L_FORUM}</td><td></td><tr><tr><td colspan="2">
<!-- 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" style="width: 50px;">
<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>

</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>
<td class="row3 over" align="center" valign="middle" height="50">
<span class="gensmall">
<div class="sujets_messages"><b>{catrow.forumrow.TOPICS} sujets</b> | <b>{catrow.forumrow.POSTS} messages</b></div>
<div class="derniers_sujets">{catrow.forumrow.LAST_POST}</div></span>
</td>
<!-- BEGIN forum_link_no -->

<!-- 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>
<!-- 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 -->
</td></tr></table><img src="{SPACER}" alt="" height="5" width="1" /><!-- END tablefoot --><!-- END catrow -->

Et dans votre CSS, faudra remplacer l'autre par ceci =>

Code:

.fondtitres{
min-width: 450px;
min-height: 50px;
text-align: center;
align: center;
background: url('http://img186.imageshack.us/img186/8813/sanstitre1vmi.png') center;
background-repeat: no-repeat;
}

[Invité]

Super ça marche. Merci beaucoup
Seul petit hic. Il y a des espaces entres chaque colonne && chaque rangée. Comment les supprimer ?

[Anzu]

Je n'ai pas réussi à les enlever > < '
Désolée

[Invité]

Pas grave. Je vais me débrouiller autrement ^^
Merci beaucoup pour ton aide