Catégorie

[MAZOHYST]

Bonjour à tous
Je m'apprête, dans les jours à suivre à ouvrir ce forum : http://tokyo-nights.forumactif.org/

Cependant, le design des catégories ne me plait plus.

J'ai pris un imprim' écran de celle-ci.
En 1, ce que j'ai, et en 2, ce que j'aimerais.

EXEMPLE :

Je voudrais garder tout ce qui se trouve dans la colonne "dernier message" o:

Voici mon Template index_box :

index_box:

S'il vous faut quoi que ce soit d'autre, je me tiens à votre disposition 8D
Merci d'avance à ceux qui se pencherons sur mon problème ♥

[MlleAlys]

Bonsoir !
Je ne sais pas si ça va donner exactement ce que tu veux, mais je te propose ce template :

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%" border="0" cellspacing="0" cellpadding="0"><tr><td><img src="http://img15.hostingpics.net/pics/453778578637Sanstitre.png" /></td></tr></table>
<table class="forumline" width="100%" border="0" cellspacing="1" cellpadding="0">
  <tr>
      <th 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="row1 over barreKT" colspan="{catrow.forumrow.INC_SPAN}" valign="top" width="100%" height="50">
        <div class="StatsForum">{catrow.forumrow.TOPICS} sujets & {catrow.forumrow.POSTS} messages</div>
                         
                          <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 forum-description" style='display:block; font-size:11px;'>{catrow.forumrow.FORUM_DESC}</span>
        <span class="gensmall" id="subforums" style="margin-right:40px; text-align: right;">
  <!-- 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>
<script type="text/javascript">
jQuery('#subforums').html(jQuery('#subforums').html().replace(/, /g,' • ')).removeAttr('id');
</script>
      </td>
     
      <td class="row3 over" align="center" valign="middle" height="50">
                  <img title="{catrow.forumrow.L_FORUM_FOLDER_ALT}" src="{catrow.forumrow.FORUM_FOLDER_IMG}" alt="{catrow.forumrow.L_FORUM_FOLDER_ALT}" />
                  <br />
                  <span class="gensmall">{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><table width="100%" border="0" cellspacing="0" cellpadding="0"><tr><td><img src="http://img15.hostingpics.net/pics/144730568693Sanstitre.png" /></td></tr></table><img src="{SPACER}" alt="" height="5" width="1" /><!-- END tablefoot --><!-- END catrow -->

Et ce css à ajouter pour les réglages ^^ :

Code:

.StatsForum {
    position: relative;
    top: 10px;
}
.forumlink {
    position: relative;
    left: 20px;
    top: 5px;
}
.forum-description {
    background-color: #292929;
    padding: 10px;
    border-radius: 20px;
    padding-left: 100px;
}

[MAZOHYST]

Merci beaucoup MlleAlys ♥ ça ressemble déjà un peu plus à ce que je souhaite.
Cependant, une espace de gros espace se trouve dans mes forums, et je ne sais pas comment le retirer :

look look 8D:

Ainsi que l'espace en dessous du texte, qui ne semble pas s'adapter en fonction du changement de bordure XD

[MlleAlys]

l'espace à gauche ? c'était pour faire comme sur votre capture ^^"

Essaye avec ce css là :

Code:

.StatsForum {  /*position nombre de sujets et messages*/
    position: relative;
    top: 27px;
}
.forumlink {  /*position titre du forum*/
    position: relative;
    left: 20px;
    top: 12px;
}
.forum-description {
    background-color: #292929;  /*couleur de fond de la description*/
    padding: 10px;
    border-radius: 20px;  /*coins arrondis*/
}

Pour les espaces qui restent encore, j'avoue que je ne sais pas trop, ils ne viennent pas du template en tout cas... Essaye de voir directement dans la description du forum s'il n'y a pas une div ou un retour à la ligne en trop, et sinon on peut essayer de tricher en ajoutant ce code :

Code:

.genmed.forum-description div {
  margin-left: 0px !important;  /*pour supprimer espace à gauche de la description*/
  margin-bottom: -12px;  /*pour supprimer espace en dessous de la description*/
}

Est ce que c'est mieux ?

[MAZOHYST]

Merci, j'ai enfin ce que je veux ♥

[MlleAlys]

de rien ^^