Problème avec les catégories

[Sanae]

Bonjour, vu que les catégories toutes modifiées sont devenues assez courantes dans le monde du RPG. Mon vieux gaillard semble ne plus passer vers les nouvelles générations. J'ai tenté de faire quelque chose avec les catégories et les sous-forums et on va dire que c'est un 0 pointé !

J'aurai voulu que les sous-forums aillent un peu plus sur la droite au lieu qu'il reste sous la description de la catégorie et qu'il ne les collent pas comme il le fait et qu'il n'apparaissent pas aux endroits où il n'y a pas... de sous-forums..

Template

Code:

<br><br>
            <!-- BEGIN catrow --><!-- BEGIN tablehead --><center><table width="60%" border="0" cellspacing="0" cellpadding="0">
              <tr>
                  <th colspan="3" nowrap="nowrap" width="100%" class="secondarytitle"> {catrow.tablehead.L_FORUM} </th>
              </tr></table>
        <table class="tourcat" width="100%" border="0" cellspacing="0" 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 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 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="descrip">
                   <span class="genmed">{catrow.forumrow.FORUM_DESC}</span></div>
                    <div class="sous-forum"><center>{catrow.forumrow.L_LINKS}{catrow.forumrow.LINKS}</center></div>
                    <span class="gensmall">
        <div class="sujmsg">
                        <!-- BEGIN switch_moderators_links -->
                        {catrow.forumrow.switch_moderators_links.L_MODERATOR}{catrow.forumrow.switch_moderators_links.MODERATORS}
                        <!-- END switch_moderators_links -->
                    </span>
                  </td>
                  <td align="center" valign="middle" height="50">
                    <span class="gensmall"><div style="width:150px;" class="dersuj">{catrow.forumrow.LAST_POST}</div></span>
                  </td>
              </tr>
              <!-- END forumrow -->
              <!-- BEGIN catfoot -->
              <tr>
                  <!-- BEGIN inc -->
                  <td class="{catrow.catfoot.inc.INC_CLASS}" width="46">
            <img src="{SPACER}" height="400" width="700" /></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 --></center>


CSS

Code:

       .tourcat {
    -moz-box-shadow: 2px 2px 2px dimgray;
 -moz-border-radius: 15px 15px 15px 15px;
background-color : #000000;
    padding: 15px;}
 
.dersuj {
margin-left : 5px;
background-color: #0B1342;
 -moz-border-radius: 15px 15px 15px 15px;
  border-radius:10px;
height : 80px;
padding : 5px;
align : center center;
}
 
.descrip{
background-color: #0B1342;
 -moz-border-radius: 15px 15px 15px 15px;
height : 110px;
overflow : auto;
padding : 10px;
border-radius:10px;
align : center center;
}
.sujmsg {
position : relative;
padding : 5px;
left : 175px;
top : -10px;
}
 
.secondarytitle {
    -moz-box-shadow: 2px 2px 2px dimgray;
 -moz-border-radius: 15px 15px 0px 0px;
background-color : #000000;
height : 50px;
}
.postbody {
-moz-border-radius: 19px;
-webkit-border-radius: 19px;
border-radius: 19px;
padding: 7px;
}

a.cattitle{
 font-size: 22px;
 text-align: center;
 margin: 4px;
}

.sous-forum {
background-color: #0B1342;
border-radius: 15px 15px 15px 15px;
-moz-box-shadow: 2px 2px 2px dimgray;
border: 1px solid #0A0A2A;
padding: 3px;
width: auto;
height: auto;
display: block;
}

Si vous ne comprenez pas ce que je dis, je vous montrerai en photo ou tout simplement, faire un tour sur mon forum.

S'il-vous-plait ! T_T

[Self]

Bonjour,

Dans votre template, cherchez le passage :

Code:

                  <td align="center" valign="middle" height="50">
                    <span class="gensmall"><div style="width:150px;" class="dersuj">{catrow.forumrow.LAST_POST}</div></span>
                  </td>
              </tr>

Et placez y après ce code :

Code:

<!--Script d'apparition des sous forums-->
<script>
    $(function(){
        $('.sous-forum center').each(function(){
            if($(this).html() != ""){
                $(this).parent().css('display', 'inline-block');
            }else{
                $(this).parent().addClass('subhidden');
            }
        });
    });
</script>
<!--Fin du script des sous forums-->

Puis dans votre CSS, trouvez le passage suivant :

Code:

.sous-forum {
background-color: #0B1342;
border-radius: 15px 15px 15px 15px;
-moz-box-shadow: 2px 2px 2px dimgray;
border: 1px solid #0A0A2A;
padding: 3px;
width: auto;
height: auto;
display: block;
}

Et remplacez le par ceci :

Code:

.sous-forum {
    width:350px; height:18px;
    overflow:auto;
    margin-left:-100px;
    background-color: #0B1342;
    border-radius: 15px 15px 15px 15px;
    -moz-box-shadow: 2px 2px 2px dimgray;
    border: 1px solid #0A0A2A;
    padding: 3px;
    display: block;
}

.subhidden{
    display:none;
}

Cordialement .

[Sanae]

*o* Merci !

Mais le problème c'est qu'il apparait même aux endroits où il n'y a pas de sous-forum. Genre une ligne bleue pas jolie du tout et rien d'écrit dedans.

[Self]

Bonjour,

Vous n'avez pas copier tout le CSS que je vous ai donné, il manque ça :

Code:

.subhidden{
    display:none;
}

Bonne soirée .

[Sanae]

..... xD

Désolée.. Plus qu'une seule question et j'aurai fini d'embêter. Pour que la description des forums ne colle les sous-forums, je dois faire un :

Code:

margin-height:20px;

? Ou je me mets le doigt dans l'oeil.

[Self]

Non, c'est margin-top qu'il faut écrire dans le bloc .sous-forum :

Code:

margin-top:20px;

Cependant je vous conseil d'utiliser :

Code:

position: relative;
top: 20px;
margin-bottom:10px;

Car avec un margin-top et le vertical-align des cellules ça risquerait de tout décaler.

Votre bloc .sous-forum en entier donnera donc :

Code:

.sous-forum {
    position: relative;
    top: 20px;
    margin-bottom:10px;
    width:350px; height:18px;
    overflow:auto;
    margin-left:-100px;
    background-color: #0B1342;
    border-radius: 15px 15px 15px 15px;
    -moz-box-shadow: 2px 2px 2px dimgray;
    border: 1px solid #0A0A2A;
    padding: 3px;
    display: block;
}

[Sanae]

C'est tout bon. Merci beaucoup ♥