Centrer les titres des forums

[Naaw-el]

Re-bonjour !

Et oui, encore une question ^^
J'espère bien que ce sera la dernière avant longtemps (je le souhaite pour vous et pour à la fois !)

Voilà mon problème, j'aimerais centrer les titres des forums.
J'ai rechercher sur le forum si quelqu'un avait déjà traiter ce sujet et j'ai trouvé ce code qu'il fallait appliqué à chaque titre <center>TITRE DU FORUM</center>
J'ai fais tout ça, et ça n'a pas marché.

Un petit screen :

Ca les a simplement décalé de quelques pixels...

Voilà
Merci d'avance !

[Anzu]

Rebonsoir ^^

Voici le template index box modifié:

Code:

    <table width="100%" border="0" cellspacing="1" cellpadding="0" align="center">
      <tr>
          <td valign="bottom">
            <!-- BEGIN switch_user_logged_in -->
                      <!-- 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 -->
            <!-- END switch_user_logged_in -->
          </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">
                <table width="100%"><tbody><tr><td width="80%" align="center"><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}></td><td style="padding-left: 40px; text-align: right;" class="gensmall">{catrow.forumrow.POSTS} messages dans {catrow.forumrow.TOPICS} sujets.</td></tr></tbody></table>

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


C'est bien le vôtre hein

La modification a été faite ici:

Code:

<tbody><tr><td width="80%" align="center"><h{catrow.forumrow.LEVEL} class="hierarchy">
                    <span class="forumlink">
                      <a class="forumlink" href="{catrow.forumrow.U_VIEWFORUM}">{catrow.forumrow.FORUM_NAME}</a>

                    </span>

=> J'ai rajouté ceci

Code:

width="80%" align="center"

dans le td concerné.

Cordialement.

[Naaw-el]

Oui, mon template index_box n'a pas changé ^^
Ca marche parfaitement, merci beaucoup !

Et y a-t-il possibilité de déplacer les icons vers la droite et de descendre les "X nombre de messages dans X nombre de sujet" ?

Screeeen :

[Naaw-el]

Un petit up ;D

[Naaw-el]

Personne pour me répondre ? (:

[GabyS]

A mon avis, pour les icônes c'est pas possible, comme c'est une case à part, tu vas pas pouvoir la déplacer je pense, enfin je vois pas comment...

[Anzu]

Bonjour,

Pourrais je avoir votre css ? Car je n'ai pas la même chose que vous sur mon forum test.

Cordialement.

[Naaw-el]

Bien sur ;D

Le voici :

Code:

.ombre {
-moz-text-shadow: 1px 2px 2px black;     
-webkit-text-shadow: 1px 2px 2px black;
text-shadow: 1px 2px 2px black;
}

.quote{
   font-family: bookman,Arial,Helvetica,sans-serif;
   font-size: 11px;
   color: #6595e5;
   line-height: 100%;
   background-color: #204a90;
   border: #204a90;
   border-style: solid;
   border-left-width:1px;
   border-top-width: 1px;
   border-right-width: 1px;
   border-bottom-width: 1px}

.code{
    font-family: bookman,Courier New,sans-serif;
    font-size: 11px;
    color: #002a6e;
   background-color: #4883e3;
    border: #4883e3;
    border-style: solid;
   border-left-width: 1px;
    border-top-width: 1px;
    border-right-width: 1px;
    border-bottom-width: 1px}

.navig {
position: absolute;
top: 260px;
width: 100%;
}

.gen,.genmed,.gensmall {
    color : #8aaee8;
}

.forumlink{
    font-weight: ;
    font-size: 11px;
    color : #7daccd;
    }
a.forumlink {
    text-decoration: none;
    color : #7daccd;
    }
a.forumlink:link {
    color : #7daccd;
    }
a.forumlink:visited {
    color : #7daccd;
    }
a.forumlink:active {
    color : #7daccd;
    }
a.forumlink:hover{
    text-decoration: none;
    color : #7daccd;
    }


 .bodylinewidth {
    margin-bottom: -20px;
    margin-top: -20px;
    widht: 980px;
    }

.bodyline {
  padding: 0px;
    background-color: #285db4;
    } 


    th {
      color: #285db4;
      font-size: 11px;
      font-weight : bold;
      background-color: #6390d9;
      height: 25px;
      background-image: url("");
      padding: 2px 3px;
      }

    .secondarytitle,.secondarytitle h2 {
      margin: 0;
      padding: 0;
      color: #285db4;
    background-color: #6390d9;
      }

    td.row1,td.row3.over:hover {
        background-color: #285db4;
        }
    td.row2,td.row1.over:hover {
        background-color: #285db4;
        }
    td.row3{
        background-color: #285db4;
        }
    td.rowpic {
      background-color: #285db4;
      background-image: url("");
      css}

    a { text-decoration: none; }

    .statistiques{
    border:0px;
    background-image: url("http://i.imgur.com/PYWm8.png");
    background-repeat: no-repeat;
    background-position: left;
    width:980px;
    text-align: center;
    }

    .groupes{
    height:px;
    padding-right:6px;
    padding-left:6px;
    padding-bottom:3px;
    font-size:15px;
    text-decoration: none !important;
    margin-left: px;}

    .description {
    -moz-background-clip:border;
    -moz-background-inline-policy:continuous;
    -moz-background-origin:padding;
    -moz-border-radius-topleft:10px;
    -moz-border-radius-topright:10px;
    -moz-border-radius-bottomleft:10px;
    -moz-border-radius-bottomright:10px;
    background: none repeat scroll 0 0;
    background-color: #a2c0f3;
    border-color: #;
    border-style:none;
    color: #4d77be;
    margin-left:150px;
    margin-right:150px;
    margin-top:10px;
    padding:5px 5px 5px 25px;
    }

.autour {
overflow:hidden;
padding-left:20px;
padding-right:20px;
margin-left:auto;
margin-right:auto;
margin-bottom: -10px;
margin-top: -10px;}

.bodylinewidth {
padding: 0px;
background-color: #285db4;
-moz-box-shadow: 0px 0px 20px #000000;
box-shadow: 0px 0px 20px #000000;
-webkit-box-shadow: 0px 0px 20px #000000;
margin-top: -4px;
margin-bottom: -4px;
}

        .colorpicker {
      width: 356px;
      height: 176px;
      overflow: hidden;
      position: absolute;
      background: url(http://tinyurl.com/colorpickerimg/colorpicker_background.png);
      font-family: Arial, Helvetica, sans-serif;
      display: none;
    }
    .colorpicker_color {
      width: 150px;
      height: 150px;
      left: 14px;
      top: 13px;
      position: absolute;
      background: #f00;
      overflow: hidden;
      cursor: crosshair;
    }
    .colorpicker_color div {
      position: absolute;
      top: 0;
      left: 0;
      width: 150px;
      height: 150px;
      background: url(http://tinyurl.com/colorpickerimg/colorpicker_overlay.png);
    }
    .colorpicker_color div div {
      position: absolute;
      top: 0;
      left: 0;
      width: 11px;
      height: 11px;
      overflow: hidden;
      background: url(http://tinyurl.com/colorpickerimg/colorpicker_select.gif);
      margin: -5px 0 0 -5px;
    }
    .colorpicker_hue {
      position: absolute;
      top: 13px;
      left: 171px;
      width: 35px;
      height: 150px;
      cursor: n-resize;
    }
    .colorpicker_hue div {
      position: absolute;
      width: 35px;
      height: 9px;
      overflow: hidden;
      background: url(http://tinyurl.com/colorpickerimg/colorpicker_indic.gif) left top;
      margin: -4px 0 0 0;
      left: 0px;
    }
    .colorpicker_new_color {
      position: absolute;
      width: 60px;
      height: 30px;
      left: 213px;
      top: 13px;
      background: #f00;
    }
    .colorpicker_current_color {
      position: absolute;
      width: 60px;
      height: 30px;
      left: 283px;
      top: 13px;
      background: #f00;
    }
    .colorpicker input {
      background-color: transparent;
      border: 1px solid transparent;
      position: absolute;
      font-size: 10px;
      font-family: Arial, Helvetica, sans-serif;
      color: #898989;
      top: 4px;
      right: 11px;
      text-align: right;
      margin: 0;
      padding: 0;
      height: 11px;
    }
    .colorpicker_hex {
      position: absolute;
      width: 72px;
      height: 22px;
      background: url(http://tinyurl.com/colorpickerimg/colorpicker_hex.png) top;
      left: 212px;
      top: 142px;
    }
    .colorpicker_hex input {
      right: 6px;
    }
    .colorpicker_field {
      height: 22px;
      width: 62px;
      background-position: top;
      position: absolute;
    }
    .colorpicker_field span {
      position: absolute;
      width: 12px;
      height: 22px;
      overflow: hidden;
      top: 0;
      right: 0;
      cursor: n-resize;
    }
    .colorpicker_rgb_r {
      background-image: url(http://tinyurl.com/colorpickerimg/colorpicker_rgb_r.png);
      top: 52px;
      left: 212px;
    }
    .colorpicker_rgb_g {
      background-image: url(http://tinyurl.com/colorpickerimg/colorpicker_rgb_g.png);
      top: 82px;
      left: 212px;
    }
    .colorpicker_rgb_b {
      background-image: url(http://tinyurl.com/colorpickerimg/colorpicker_rgb_b.png);
      top: 112px;
      left: 212px;
    }
    .colorpicker_hsb_h {
      background-image: url(http://tinyurl.com/colorpickerimg/colorpicker_hsb_h.png);
      top: 52px;
      left: 282px;
    }
    .colorpicker_hsb_s {
      background-image: url(http://tinyurl.com/colorpickerimg/colorpicker_hsb_s.png);
      top: 82px;
      left: 282px;
    }
    .colorpicker_hsb_b {
      background-image: url(http://tinyurl.com/colorpickerimg/colorpicker_hsb_b.png);
      top: 112px;
      left: 282px;
    }
    .colorpicker_submit {
      position: absolute;
      width: 22px;
      height: 22px;
      background: url(http://tinyurl.com/colorpickerimg/colorpicker_submit.png) top;
      left: 322px;
      top: 142px;
      overflow: hidden;
    }
    .colorpicker_focus {
      background-position: center;
    }
    .colorpicker_hex.colorpicker_focus {
      background-position: bottom;
    }
    .colorpicker_submit.colorpicker_focus {
      background-position: bottom;
    }
    .colorpicker_slider {
      background-position: bottom;
    }

[Anzu]

Ici:

Code:

  .description {
        -moz-background-clip:border;
        -moz-background-inline-policy:continuous;
        -moz-background-origin:padding;
        -moz-border-radius-topleft:10px;
        -moz-border-radius-topright:10px;
        -moz-border-radius-bottomleft:10px;
        -moz-border-radius-bottomright:10px;
        background: none repeat scroll 0 0;
        background-color: #a2c0f3;
        border-color: #;
        border-style:none;
        color: #4d77be;
        margin-left:150px;
        margin-right:150px;
        margin-top:10px;
        padding:5px 5px 5px 25px;
        }

Soit vous retirez le margin left, soit vous le réduisez.

SInon dans le template, vous mettez une largeur dans ce td:

Code:

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

Genre

Code:

<td style="min-width: ???px">

Pour sujets et messages, vous le voudriez à quelle hauteur exactement ? Au niveau des descriptions ?

[Naaw-el]

Merci beaucoup, tout fonctionne ;D
Pour sujets et messages, après avoir vu ce que ça fait avec les icons centrés, voilà ce qui serait mieux, si possible.



Donc ce serait au niveau des nouveaux messages etc...

Merci d'avance (:

[Anzu]

• Repérez donc ceci:

Code:

{catrow.forumrow.POSTS} messages dans {catrow.forumrow.TOPICS} sujets.

Retirez le td dans lequel il se trouvait puis:

• Repérez ceci:

Code:

        <td class="row3 over" align="center" valign="middle" height="50">
                <span class="gensmall">{catrow.forumrow.LAST_POST}</span>
              </td>

Placez juste avant le span, comme ceci:

Code:

        <td class="row3 over" align="center" valign="middle" height="50">{catrow.forumrow.POSTS} messages dans {catrow.forumrow.TOPICS} sujets.<span class="gensmall">{catrow.forumrow.LAST_POST}</span>
              </td>

Rajoutez un ou plusieurs retours à la ligne:

Code:

        <td class="row3 over" align="center" valign="middle" height="50">{catrow.forumrow.POSTS} messages dans {catrow.forumrow.TOPICS} sujets.<br /><br /><span class="gensmall">{catrow.forumrow.LAST_POST}</span>
              </td>

Cordialement.

[Naaw-el]

Merci pour votre réponse, seulement je ne comprends pas ce que vous entendez pas "retirer le td" :/
Comment faire ?

[Anzu]

Il y a ceci:

<td style="padding-left: 40px; text-align: right;" class="gensmall">{catrow.forumrow.POSTS} messages dans {catrow.forumrow.TOPICS} sujets.</td

Vous prenez uniquement les variables, et le reste vous supprimez du template, tout simplement. Juste que ca sert à rien de laisser ce td dans le vent


Vous obtenez:

Code:

        <table width="100%" border="0" cellspacing="1" cellpadding="0" align="center">
          <tr>
              <td valign="bottom">
                <!-- BEGIN switch_user_logged_in -->
                          <!-- 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 -->
                <!-- END switch_user_logged_in -->
              </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">
                    <table width="100%"><tbody><tr><td width="80%" align="center"><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}></td></tr></tbody></table>

                <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">
              {catrow.forumrow.POSTS} messages dans {catrow.forumrow.TOPICS} sujets.<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><img src="{SPACER}" alt="" height="5" width="1" /><!-- END tablefoot --><!-- END catrow -->


[Naaw-el]

D'accord
Ca marche parfaitement, merci !
Je mets résolu.