Modification des catégorie =/

3 participants

Voir le sujet précédent Voir le sujet suivant Aller en bas

Résolu Modification des catégorie =/

Message par Aliichaa Jeu 20 Oct 2011 - 12:25

Voili voilou !!! j'aide une amie pour son forum en lui passant des anciennes template auquel j'vais demande des modification ...


Modification des catégorie =/ Modale10

Comme on le vois sur l'image 1 , les descriptions sont plus vers le bas ce qui, quand elles sont trop longue, déforme le forum =/ .. Problème que mon amie n'aime pas....

Elle aurait voulu qu'elle soit plus haut, comme sur l'image 2 ^^..

Je précise que la template et le CCs sont déjà fait, on voudrais juste que les description soit plus haute, même si elle sont en fasse des statistique...

INDEX-BOX :
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}

        </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">
  <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}>
      <table width="100%" class="fondcategorie"><tr><td  width="80%"></td><td class="stats"><span class="gensmall">{catrow.forumrow.TOPICS} sujets | {catrow.forumrow.POSTS} messages</span></td></tr><td width="80%"><div class="descrip"><span class="genmed">{catrow.forumrow.FORUM_DESC}</span></div></td><td  width="25%"class="sousfo"><span class="gensmall" id="subforums">{catrow.forumrow.L_LINKS}{catrow.forumrow.LINKS}</span><script type="text/javascript">
jQuery('#subforums').html(jQuery('#subforums').html().replace(/, /g,'<br/>')).removeAttr('id');
</script></td></tr></table>
        <span class="gensmall">
            <!-- BEGIN switch_moderators_links -->
            {catrow.forumrow.switch_moderators_links.L_MODERATOR}{catrow.forumrow.switch_moderators_links.MODERATORS}
            <!-- END switch_moderators_links -->
                    </span>
        </span>
      </td>
      <td class="row3 over" align="center" valign="middle" height="50">
        <div class="lastm"><span class="gensmall">{catrow.forumrow.LAST_POST}</span></div>
      </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 -->

CCS :

Code:
//***CATEGORIE***//

/*sous-forums*/
.sousfo{
background-image: url("//");
webkit-border-radius: 30px; border-radius: 30px;
padding: 10px;/*marge intérieure*/
margin: 10px;/*marge extérieure*/
 border-radius: 30px;border: solid 2px    #FFFFFF;}



/*statistiques*/
.stats{
background-image: url('http://img11.hostingpics.net/pics/312942ghj.png');
webkit-border-radius: 30px; border-radius: 30px;
padding: 10px;/*marge intérieure*/
margin: 10px;/*marge extérieure*/
 border-radius: 30px;border: solid 2px    #000000;
}

/*dernier message*/
.lastm{
background-image: url('http://img11.hostingpics.net/pics/312942ghj.png');
webkit-border-radius: 30px; border-radius: 30px;
padding: 10px;/*marge intérieure*/
margin: 10px;/*marge extérieure*/
 border-radius: 30px;border: solid 2px    #000000;
}

/*fond description*/
.descrip{
background-image: url('http://img11.hostingpics.net/pics/312942ghj.png');
webkit-border-radius: 30px; border-radius: 30px;
padding: 10px;/*marge intérieure*/
margin: 10px;/*marge extérieure*/

 border-radius: 30px;border: solid 2px    #000000;
}



Dernière édition par Aliichaa le Dim 6 Nov 2011 - 14:26, édité 1 fois
Aliichaa

Aliichaa
****

Féminin
Messages : 331
Inscrit(e) le : 13/12/2010

http://test-shinepikapi.forumpersos.com/
Aliichaa a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Modification des catégorie =/

Message par kheino Jeu 20 Oct 2011 - 17:36

Bonjour,

Tout d'abord, centrer les codes est vraiment une grosse FBI (Fausse Bonne Idée) et je ne mets pas ce genre de code dans mon template ou dans mon CSS, c'est à s'y perdre.

Mais pour ton problème, (sans pouvoir vraiment vérifier tant que les codes sont ainsi présentés), essaie de réduire le padding-top de la description :
padding: 3px 10px; /*qui veut dire 3px-top et 10px-pour le reste*/
Il me semble que ce devrait alors se situer plus haut...
kheino

kheino
Membre habitué

Féminin
Messages : 1698
Inscrit(e) le : 09/05/2010

http://www.siteduzero.com/
kheino a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Modification des catégorie =/

Message par Aliichaa Jeu 20 Oct 2011 - 18:21

Euh, ça ne fait rien du tout je croit...
Aliichaa

Aliichaa
****

Féminin
Messages : 331
Inscrit(e) le : 13/12/2010

http://test-shinepikapi.forumpersos.com/
Aliichaa a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Modification des catégorie =/

Message par kheino Jeu 20 Oct 2011 - 18:35

Tu as bien modifié dans l'intitulé : .descrip
Pour bien voir si c'est le bon, essaie de mettre une valeur extrême au top, comme :
-3px;

Sinon, dans le template, à cet endroit :
<td width="80%"><div class="descrip">
Pourquoi ne pas mettre le "class" dans la balise "td" et à celle-ci lui faire gérer l'alignement vertical puisqu'elle le peut :
<td width="80%" class="descrip" valign="top">
Tout en gérant aussi avec le padding-top.

kheino

kheino
Membre habitué

Féminin
Messages : 1698
Inscrit(e) le : 09/05/2010

http://www.siteduzero.com/
kheino a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Modification des catégorie =/

Message par Aliichaa Jeu 20 Oct 2011 - 19:45

je ne comprend plus rien..
Aliichaa

Aliichaa
****

Féminin
Messages : 331
Inscrit(e) le : 13/12/2010

http://test-shinepikapi.forumpersos.com/
Aliichaa a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Modification des catégorie =/

Message par kheino Jeu 20 Oct 2011 - 20:06

Dans ton template, en lieu et place d'ajouter une balise "div" juste pour lui donner le class="descrip"
pourquoi ne pas donner ce même class="descrip" au "td" (cellule qui contient la description d'un forum), qui en plus applique la propriété du vertical-aligne et l'aligner déjà vers le haut :
valign="top" "middle" ou "bottom"

Donc à l'endroit indiqué, on supprime la "div" et ça donne au lien de ça :
Code:
<td width="80%" class="descrip" valign="top"><span class="genmed">{catrow.forumrow.FORUM_DESC}</span></div></td>
Ceci :
Code:
<td width="80%"><div class="descrip"><span class="genmed">{catrow.forumrow.FORUM_DESC}</span></td>
kheino

kheino
Membre habitué

Féminin
Messages : 1698
Inscrit(e) le : 09/05/2010

http://www.siteduzero.com/
kheino a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Modification des catégorie =/

Message par kheino Jeu 20 Oct 2011 - 20:08

Dans ton template, en lieu et place d'ajouter une balise "div" juste pour lui donner le class="descrip"
pourquoi ne pas donner ce même class="descrip" au "td" (cellule qui contient la description d'un forum), qui en plus applique la propriété du vertical-aligne et peut l'aligner déjà vers le haut :
valign="top" "middle" ou "bottom"

Donc à l'endroit indiqué, on supprime la "div" et ça donne au lieu de ça :
Code:
<td width="80%"><div class="descrip"><span class="genmed">{catrow.forumrow.FORUM_DESC}</span></div></td>
Ceci :
Code:
<td width="80%" class="descrip" valign="top"><span class="genmed">{catrow.forumrow.FORUM_DESC}</span></td>
kheino

kheino
Membre habitué

Féminin
Messages : 1698
Inscrit(e) le : 09/05/2010

http://www.siteduzero.com/
kheino a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Modification des catégorie =/

Message par Aliichaa Jeu 20 Oct 2011 - 22:33

Et ensuite? Ou est le changement? Je l'ai fait sur un de mes forum pour le moment car je n'ai pas acces au template de l'autre.
Aliichaa

Aliichaa
****

Féminin
Messages : 331
Inscrit(e) le : 13/12/2010

http://test-shinepikapi.forumpersos.com/
Aliichaa a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Modification des catégorie =/

Message par kheino Jeu 20 Oct 2011 - 22:58

Il n'y a pas de changement ?
La description n'est pas remontée ?

Comme je l'ai dit plus haut, j'ai beaucoup de peine avec ces codes centrés, donc je ne m'y retrouve pas (et franchement pas le temps de les remettre en ordre).
La manière dont sont rédigés la plupart des codes, fait aussi qu'on les lit bien avec l'habitude. C'est exactement pareil pour les templates, surtout l'index_box, qui est l'un des plus simple à suivre...

Alors peut-être que je n'ai pas vu quelque chose dans le CSS ou le template. /-:

kheino

kheino
Membre habitué

Féminin
Messages : 1698
Inscrit(e) le : 09/05/2010

http://www.siteduzero.com/
kheino a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Modification des catégorie =/

Message par Aliichaa Jeu 3 Nov 2011 - 6:59

personne peut m'aider? =/
Parce que, les description agrandit le forum et ça devient génant...
Aliichaa

Aliichaa
****

Féminin
Messages : 331
Inscrit(e) le : 13/12/2010

http://test-shinepikapi.forumpersos.com/
Aliichaa a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Modification des catégorie =/

Message par Anzu Ven 4 Nov 2011 - 0:51


Bonsoir,

Remplacez votre index box par celui ci:

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}
       
                </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">
          <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}>
              <table width="100%" class="fondcategorie"><tr><td width="80%" rowspan="2" valign="top"><div class="descrip"><span class="genmed">{catrow.forumrow.FORUM_DESC}</span></div></td><td class="stats"><span class="gensmall">{catrow.forumrow.TOPICS} sujets | {catrow.forumrow.POSTS} messages</span></td></tr><td  width="25%"class="sousfo"><span class="gensmall" id="subforums">{catrow.forumrow.L_LINKS}{catrow.forumrow.LINKS}</span><script type="text/javascript">
        jQuery('#subforums').html(jQuery('#subforums').html().replace(/, /g,'<br/>')).removeAttr('id');
        </script></td></tr></table>
                <span class="gensmall">
                    <!-- BEGIN switch_moderators_links -->
                    {catrow.forumrow.switch_moderators_links.L_MODERATOR}{catrow.forumrow.switch_moderators_links.MODERATORS}
                    <!-- END switch_moderators_links -->
                            </span>
                </span>
              </td>
              <td class="row3 over" align="center" valign="middle" height="50">
                <div class="lastm"><span class="gensmall">{catrow.forumrow.LAST_POST}</span></div>
              </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 -->

• La description se trouvait dans un autre tr, je l'ai déplacé dans celui du dessus et j'ai mis un rowspan de 2 dans le td de la description ^^

Cordialement.

Anzu

Anzu
Membre actif

Féminin
Messages : 20685
Inscrit(e) le : 30/08/2007

https://forum.forumactif.com/
Anzu a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Modification des catégorie =/

Message par Aliichaa Ven 4 Nov 2011 - 17:03

Sur mon forum test, c'est parfait ^^ , mais je n'ai pas acces aux templates de mon amie, je lui passerais le template plus tard pour voir si cela lui convient, je vous redonnerais des nouvelles ^^
Aliichaa

Aliichaa
****

Féminin
Messages : 331
Inscrit(e) le : 13/12/2010

http://test-shinepikapi.forumpersos.com/
Aliichaa a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Modification des catégorie =/

Message par Aliichaa Dim 6 Nov 2011 - 14:25

je valide ^^ , je mets en résolu ^^
Aliichaa

Aliichaa
****

Féminin
Messages : 331
Inscrit(e) le : 13/12/2010

http://test-shinepikapi.forumpersos.com/
Aliichaa a été remercié(e) par l'auteur de ce sujet.

Voir le sujet précédent Voir le sujet suivant Revenir en haut

- Sujets similaires

Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum