Centrer l'image des nouveaux messages et la cellule des derniers messages

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

Résolu Centrer l'image des nouveaux messages et la cellule des derniers messages

Message par Lilith Anguis le Dim 13 Nov 2016 - 23:36

Détails techniques


Version du forum : phpBB2
Poste occupé : Fondateur
Navigateur(s) concerné(s) : non défini
Personnes concernées par le problème : Moi uniquement
Lien du forum : http://hogwartsfamily.forumactif.org/

Description du problème

Bonsoir,

Je viens vers vous parce que j'aimerais pouvoir centrer l'image des nouveaux messages sur la colonne de gauche de mon forum, ainsi que la cellule des derniers messages colonne de droite. J'ai bien réussi à faire quelque chose mais ma modification est trop globale. Et je ne sais pas où je dois ajouter une div, ni dans quel template l'ajouter pour modifier spécifiquement ces deux colonnes. Je m'arrache les cheveux avec depuis des semaines, et je n'arrive pas à trouver un topic ou il en est question non plus XD

Ce que j'ai ajouté au css et qui ne conviens pas, car cela est trop global et impact le forum dans sa globalité (centrage de l'avatar et de l'affichage des sujets et des messages entre autre):

Code:
td.row3 {vertical-align: middle !important;}
td.row1 {vertical-align: middle !important;}

Merci d'avance pour votre aide ♥


Dernière édition par Lilith Anguis le Mer 16 Nov 2016 - 12:50, édité 1 fois
avatar

Lilith Anguis
*

Féminin
Messages : 40
Inscrit(e) le : 07/01/2015

http://hogwartsfamily.forumactif.org/
Lilith Anguis a été remercié(e) par l'auteur de ce sujet.
  • 0

Résolu Re: Centrer l'image des nouveaux messages et la cellule des derniers messages

Message par GoichonTurf le Mar 15 Nov 2016 - 20:02

Bonjour essaye ce code java sur index et forum et sous forum

Code:
/***** CODIGO IMPLEMENTADO POR SR.SMITH PARA EL FORO ESPAÑOL DE AYUDA DE FORO ACTIVO ****/
$(document).ready(function(){
 for (var i=0; i<$("ul.topiclist.forums li.row").length; i++) {
 var alturad= $("ul.topiclist.forums li.row:eq(" + i + ") dl").height();   
 var altural= $("ul.topiclist.forums li.row:eq(" + i + ") dl.icon dd.lastpost span").height();
 var alturat= $("ul.topiclist.forums li.row:eq(" + i + ") dl.icon dd.topics").height();
 if (((alturad)-(altural))/2 >= 0){
 $("ul.topiclist.forums li.row:eq(" + i + ") dl.icon dd.lastpost").css ({"margin-top": (((alturad)-(altural))/2),"margin-bottom": (((alturad)-(altural))/2)});
 $("ul.topiclist.forums li.row:eq(" + i + ") dl.icon dd.topics").css ({"margin-top": ((alturad-(alturat))/2),"margin-bottom": ((alturad-(alturat))/2)});
 $("ul.topiclist.forums li.row:eq(" + i + ") dl.icon dd.posts").css ({"margin-top": ((alturad-(alturat))/2),"margin-bottom": ((alturad-(alturat))/2)});
 }
 }
});

amicalement serge
avatar

GoichonTurf
****

Messages : 226
Inscrit(e) le : 07/11/2016

http://goichonturf.forumactif.com/
GoichonTurf a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Centrer l'image des nouveaux messages et la cellule des derniers messages

Message par Lilith Anguis le Mar 15 Nov 2016 - 21:35

Tout d'abord merci beaucoup de te pencher sur son mon cas. Ça ne semble pas fonctionner sur mon forum Very Happy

Ensuite pour plus de précision, je vais réaménager certains sous forum en fait et ça donne ceci :
Spoiler:


Et il faut avouer qu’esthétiquement c'est plutôt moche d'avoir l'image/les infos en haut comme ça^^
avatar

Lilith Anguis
*

Féminin
Messages : 40
Inscrit(e) le : 07/01/2015

http://hogwartsfamily.forumactif.org/
Lilith Anguis a été remercié(e) par l'auteur de ce sujet.
  • 0

Résolu Re: Centrer l'image des nouveaux messages et la cellule des derniers messages

Message par MlleAlys le Mar 15 Nov 2016 - 22:12

Bonjour,
Pour un code plus précis, il faudrait effectivement passer par le template, soit index_box (affichage des catégories). Pourriez-vous fournir le votre pour que l'on puisse vous aider ?
avatar

MlleAlys
Membre actif

Messages : 4556
Inscrit(e) le : 12/09/2012

MlleAlys a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Centrer l'image des nouveaux messages et la cellule des derniers messages

Message par Lilith Anguis le Mar 15 Nov 2016 - 23:27

Bonsoir Very Happy
Ah alors j'étais pas complètement à côté de la plaque, c'est bon à savoir Very Happy

Voilà le code de mon index_box Very Happy. Merci d'avance pour votre aide !

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 --><div class="TitreCategorie">{catrow.tablehead.L_FORUM}</div><table class="forumline" width="100%" border="0" cellspacing="1" cellpadding="0">
<tr>
      <th colspan="{catrow.tablehead.INC_SPAN}" nowrap="nowrap" width="100%" class="secondarytitle">&nbsp;&nbsp;</th>
      <th nowrap="nowrap" width="150"><div style="width:150px;">{L_LASTPOST}<img onClick="i= 0;e=this.parentNode.parentNode.parentNode.parentNode.childNodes; while(++i<e.length) if(e[i].tagName=='TR')e[i].style.display=(e[i].style.display=='none')?'':'none';this.src=(this.src=='http://i45.tinypic.com/2z9dxyt.gif')?'http://i47.tinypic.com/xmmlpg.gif':'http://i45.tinypic.com/2z9dxyt.gif';" src="http://i45.tinypic.com/2z9dxyt.gif" align="center" /></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">&nbsp;</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><h{catrow.forumrow.LEVEL} class="hierarchy">
              <center>  <span class="forumlink">
                  <a class="forumlink" href="{catrow.forumrow.U_VIEWFORUM}">{catrow.forumrow.FORUM_NAME}</a>
   
                </span></center>
            </h{catrow.forumrow.LEVEL}></td></tr></tbody></table>
                  <span class="genmed"><center><div class="description">{catrow.forumrow.FORUM_DESC}</div></center></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">
         
            <!-- BEGIN avatar -->
            <div style="width: 200px;"></div>
            <span class="lastpost-avatar">{catrow.forumrow.avatar.LAST_POST_AVATAR}</span>
            <!-- END avatar -->
<div class="lastpost">{catrow.forumrow.TOPICS} rapports avec {catrow.forumrow.POSTS} parchemins
  <br /><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 -->
avatar

Lilith Anguis
*

Féminin
Messages : 40
Inscrit(e) le : 07/01/2015

http://hogwartsfamily.forumactif.org/
Lilith Anguis a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Centrer l'image des nouveaux messages et la cellule des derniers messages

Message par Milouze14 le Mer 16 Nov 2016 - 5:08

Hello Lilith Anguis et MlleAlys Wink ,

en passant tu peux supprimer le script donné par GoichonTurf qui fonctionne que pour la version phpbb3:

http://forum.forumactif.com/t388851-centrer-l-image-des-nouveaux-messages-et-la-cellule-des-derniers-messages#3265120

a++
avatar

Milouze14
Membre actif

Masculin
Messages : 4689
Inscrit(e) le : 18/04/2005

http://www.milouze14.com/
Milouze14 a été remercié(e) par l'auteur de ce sujet.
  • 0

Résolu Re: Centrer l'image des nouveaux messages et la cellule des derniers messages

Message par MlleAlys le Mer 16 Nov 2016 - 12:25

Hello,
Tu peux essayer avec 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 -->
<div class="TitreCategorie">{catrow.tablehead.L_FORUM}</div>

<table class="forumline" width="100%" border="0" cellspacing="1" cellpadding="0">
  <tr>
      <th colspan="{catrow.tablehead.INC_SPAN}" nowrap="nowrap" width="100%" class="secondarytitle">&nbsp;&nbsp;</th>
      <th nowrap="nowrap" width="150"><div style="width:150px;">{L_LASTPOST}<img onClick="i= 0;e=this.parentNode.parentNode.parentNode.parentNode.childNodes; while(++i<e.length) if(e[i].tagName=='TR')e[i].style.display=(e[i].style.display=='none')?'':'none';this.src=(this.src=='http://i45.tinypic.com/2z9dxyt.gif')?'http://i47.tinypic.com/xmmlpg.gif':'http://i45.tinypic.com/2z9dxyt.gif';" src="http://i45.tinypic.com/2z9dxyt.gif" align="center" /></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">&nbsp;</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" style="vertical-align: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%">
            <tr>
              <td>
                  <h{catrow.forumrow.LEVEL} class="hierarchy">
                    <center>
                        <span class="forumlink">
                          <a class="forumlink" href="{catrow.forumrow.U_VIEWFORUM}">{catrow.forumrow.FORUM_NAME}</a>
                        </span>
                    </center>
                  </h{catrow.forumrow.LEVEL}>
              </td>
            </tr>
        </table>
        <span class="genmed">
            <center>
              <div class="description">{catrow.forumrow.FORUM_DESC}</div>
            </center>
        </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" height="50" style="vertical-align:middle;">
       
        <!-- BEGIN avatar -->
        <div style="width: 200px;"></div>
        <span class="lastpost-avatar">{catrow.forumrow.avatar.LAST_POST_AVATAR}</span>
        <!-- END avatar -->

        <div class="lastpost">
            {catrow.forumrow.TOPICS} rapports avec {catrow.forumrow.POSTS} parchemins
            <br/><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 -->

J'ai juste modifier valign="center" en style="vertical-align:center;" dans les balises des cellules concernées, ça devrait fonctionner.
avatar

MlleAlys
Membre actif

Messages : 4556
Inscrit(e) le : 12/09/2012

MlleAlys a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Centrer l'image des nouveaux messages et la cellule des derniers messages

Message par Lilith Anguis le Mer 16 Nov 2016 - 12:49

Hello Very Happy

J'ai retiré le js, merci milouze je l'avais en effet laissé ^^
Merci beaucoup MlleAlys ! Ça fonctionne et c'est exactement ce que je cherchais, merci beaucoup ♥
avatar

Lilith Anguis
*

Féminin
Messages : 40
Inscrit(e) le : 07/01/2015

http://hogwartsfamily.forumactif.org/
Lilith Anguis a été remercié(e) par l'auteur de ce sujet.

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


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