Qui est en ligne en deux colonnes

2 participants

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

Résolu Qui est en ligne en deux colonnes

Message par Shawn Gryffondor Mer 8 Nov 2017 - 19:02

Détails techniques


Version du forum : phpBB2
Poste occupé : Administrateur
Navigateur(s) concerné(s) : Google Chrome
Capture d'écran du problème :
Voir l'image:

Personnes concernées par le problème : Tous les utilisateurs
Lien du forum : (lien masqué, vous devez poster pour le voir)

Description du problème

Bonjour, j'ai lu plusieurs sujets et suivi des tutoriaux pour réaliser mon QEEL en deux colonnes.
J'ai pourtant des problèmes d'affichage avec le seconde colonne...

Code:
 <!-- BEGIN disable_viewonline -->
  <div class="QeelIMG"></div>
  <div class="QeelGIF"></div>
    <div class="Qeel">
<table class="groupes">
  <tr>
      <td valign="top">
  <div class="QeelGroupe">
  <center><a href="liendugroupe" class="gr1">Groupe 1</a>&nbsp;
  <a href="liendugroupe" class="gr2">Groupe 2</a>&nbsp;
        <a href="liendugroupe" class="gr3">Groupe 3</a>&nbsp;
  <a href="liendugroupe" class="gr4">Groupe 4</a>&nbsp;
  <a href="liendugroupe" class="gr5">Groupe 5</a>&nbsp;
        <a href="liendugroupe" class="gr6">Groupe 6</a></center>
  </div>
    </td></tr>
      </table>
   
<div class="Qeel">
   <table style="width: 100%; border-collapse:collapse;">
      <tr>
         <td width="50%">
                          <div style="float: left; padding-left: 50px; padding-right: 100px; font-size: 12px;">
            <div style="text-align: justify;">
               <span class="gensmall" id="totalusers"> {TOTAL_USERS}
         <script type="text/javascript">document.getElementById('totalusers').innerHTML=document.getElementById ('totalusers').innerHTML.replace(/Nous avons/,"Le monde magique comptabilise");</script>
         <script type="text/javascript">document.getElementById('totalusers').innerHTML=document.getElementById ('totalusers').innerHTML.replace(/membre enregistré/,"sorcier");</script>
                <script type="text/javascript">document.getElementById('totalusers').innerHTML=document.getElementById ('totalusers').innerHTML.replace(/membres enregistrés/,"sorciers");</script></span>
               <span class="gensmall" id="totalposts"> {TOTAL_POSTS}
         <script type="text/javascript">document.getElementById('totalposts').innerHTML=document.getElementById ('totalposts').innerHTML.replace(/Nos membres ont posté un total de/,"qui ont écrit");</script>
         <script type="text/javascript">document.getElementById('totalposts').innerHTML=document.getElementById ('totalposts').innerHTML.replace(/message/,"missive");</script>
              <script type="text/javascript">document.getElementById('totalposts').innerHTML=document.getElementById ('totalposts').innerHTML.replace(/messages/,"missives");</script></span>
          <br /> <br />
       
                    <span class="gensmall" id="newestuser"> {NEWEST_USER}
         <script type="text/javascript">document.getElementById('newestuser').innerHTML=document.getElementById ('newestuser').innerHTML.replace(/L'utilisateur enregistré le plus récent est/,"Le dernier sorcier à avoir rejoint la communauté s'appelle");</script>
         <script type="text/javascript">document.getElementById('newestuser').innerHTML=document.getElementById ('newestuser').innerHTML.replace(//,"");</script>
              <script type="text/javascript">document.getElementById('newestuser').innerHTML=document.getElementById ('newestuser').innerHTML.replace(//,"");</script></span>
       
            <br /> <br />
              <span class="gensmall" id="totaluseronline"> {TOTAL_USERS_ONLINE}
         <script type="text/javascript">document.getElementById('totaluseronline').innerHTML=document.getElementById ('totaluseronline').innerHTML.replace(/Il y a en tout/,"Il y a actuellement");</script>
           <script type="text/javascript">document.getElementById('totaluseronline').innerHTML=document.getElementById ('totaluseronline').innerHTML.replace(/utilisateur en ligne/,"sorcier en ligne");</script>
         <script type="text/javascript">document.getElementById('totaluseronline').innerHTML=document.getElementById ('totaluseronline').innerHTML.replace(/utilisateurs en ligne/,"sorciers en ligne");</script>
         <script type="text/javascript">document.getElementById('totaluseronline').innerHTML=document.getElementById('totaluseronline').innerHTML.replace(/Enregistré/,"recensé par le ministère");</script>
         <script type="text/javascript">document.getElementById('totaluseronline').innerHTML=document.getElementById('totaluseronline').innerHTML.replace(/Enregistrés/,"recensés par le ministère");</script>
         <script type="text/javascript">document.getElementById('totaluseronline').innerHTML=document.getElementById('totaluseronline').innerHTML.replace(/Invisible/,"utilise une cape d'invisibilité");</script>
         <script type="text/javascript">document.getElementById('totaluseronline').innerHTML=document.getElementById('totaluseronline').innerHTML.replace(/Invisibles/,"utilisent une cape d'invisibilité");</script>
         <script type="text/javascript">document.getElementById('totaluseronline').innerHTML=document.getElementById('totaluseronline').innerHTML.replace(/Invité/,"est placé sous le sortilège de la trace");</script>
         <script type="text/javascript">document.getElementById('totaluseronline').innerHTML=document.getElementById('totaluseronline').innerHTML.replace(/Invités/,"sont placés sous le sortilège de la trace");</script></span> 
                <br /> <br />
       
         <span class="gensmall" id="loggedinuserlist"> {LOGGED_IN_USER_LIST}
         <script type="text/javascript">document.getElementById('loggedinuserlist').innerHTML=document.getElementById ('loggedinuserlist').innerHTML.replace(/Utilisateurs enregistrés/,"Sorciers en quête");</script></span>
            </div>
                          </div>
         </td> 
                 
  <td valign="top">
                         <table id="QeelTable2">      
                        <tr>
                                   <td>
                                              <td style="vertical-align:top; text-align: justify;">
                                                    <div style="float: right; padding-right: 50px; padding-left: 100px; font-size: 12px;">
                     <span class="gensmall" id="anniv">{L_WHOSBIRTHDAY_TODAY}</span>
                     <script type="text/javascript">document.getElementById('anniv').parentNode.innerHTML=document.getElementById('anniv').parentNode.innerHTML.replace(/Membres fêtant leur anniversaire aujourd'hui/,"Harry Potter Univers souhaite un bon anniversaire à").replace(/Aucun membre ne fête son anniversaire aujourd'hui/,"Aucun sorcier ne célèbre son anniversaire aujourd'hui");</script>
                                <br/>
                              <span class="gensmall">{L_CONNECTED_MEMBERS}</span>
                       <script type="text/javascript">document.getElementById('test').innerHTML=document.getElementById('test').innerHTML.replace(/Membres connectés au cours des 24 dernières heures :/,"Sorciers connectés depuis la dernière lune :");</script>
                                              </div>
                                                    </td>

                                     </td>
                   </tr>
                     </table>

  </td>
      </tr>
   </table>
</div>
<!-- END disable_viewonline -->

Je voudrais pouvoir justifier le contenu de mes deux colonnes d'une part et pouvoir leur mettre une marge à gauche comme à droite. Cela fonctionne parfaitement sur la colonne de gauche mais pas sur l'autre.

Enfin, je ne comprends pas le léger écart d'un pixel entre le début du texte dans la première colonne et le début du texte dans le deuxième. Quand je mets un fond couleur, je remarque que sur la première colonne le texte est en bord à bord.

D'autre part impossible de gérer la taille de la police, même en CSS. Les effets ne sont jamais pris en compte. J'ai supprimé une partie de mon CSS le temps de régler l'HTML.

Code:
 /*Titre QEEL*/
.QeelIMG
{
  background: url('https://img4.hostingpics.net/pics/848573QEELsmall.png') top center;
  width: 950px;
  height: 214px;
  margin: auto;
}

.QeelGIF
{
  background: url('https://img4.hostingpics.net/pics/722998tracesdepas.gif') top center;
  width: 950px;
  height: 36px;
  margin: auto;
}

  /*QEEL tableau*/
.Qeel
{
 padding-bottom: 300px;
}

    /*Colonne*/

  /*Stats Messages/Membres*/

  /*Groupes*/
 .gr1, .gr2, .gr3, .gr4, .gr5, .gr6
{
    background-color: #4CAF50; /* Green */
    border: none;
    color: white;
    padding: 3px 10px;
    border-radius: 4px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 12px;
}

 /*Groupe 1*/
.gr1
{
  color: #494949 !important;
}
/*Groupe 2*/
.gr2
{
  color: #787878 !important;
}
/*Groupe 3*/
.gr3
{
  color: #b2b2b2 !important;
}
/*Groupe 4*/
.gr4
{
  color: #e12727 !important;
}
/*Groupe 5*/
.gr5
{
  color: #e3bb41 !important;
}
/*Groupe 6*/
.gr6
{
  color: #426ae3 !important;
}

              /*Fin QEEL*/

Je vous remercie pour votre aide
avatar

Shawn Gryffondor
****

Masculin
Messages : 353
Inscrit(e) le : 03/01/2008

http://harrypotter-univers.forumactif.com/
Shawn Gryffondor a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Qui est en ligne en deux colonnes

Message par Shawn Gryffondor Jeu 9 Nov 2017 - 19:06

Je me permets de relancer ma demande.

Merci Smile
avatar

Shawn Gryffondor
****

Masculin
Messages : 353
Inscrit(e) le : 03/01/2008

http://harrypotter-univers.forumactif.com/
Shawn Gryffondor a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Qui est en ligne en deux colonnes

Message par Faline Jeu 9 Nov 2017 - 23:42

Bonsoir,

  • Pour le problème de décalage :
    Dans la cellule de droite tu as imbriqué un deuxième tableau alors que la colonne de gauche est une simple cellule :

    qui est en ligne - Qui est en ligne en deux colonnes Qeel10

    Comme tes lignes ne sont pas numérotées, je te mets juste le code où le problème commence (à la ligne 3) :
    Code:
    </td><!-- fin de la première colonne/cellule -->
    <td valign="top"><!-- début de la 2e colonne/cellule -->
    <table id="QeelTable2"><!-- tableau imbriqué, qui prend de la place en hauteur -->
    <tr>
    <td><!-- doublon avec la ligne suivante ? -->
    <td style="vertical-align:top; text-align: justify;">

    Et il faut remplir les styles de façon bien symétrique (cellpadding, justification...) sur les deux côtés du tableau.

  • Je crains que pour la taille des caractères il faudra définir la priorité !important comme pour les couleurs.


Edit :
En arrivant sur ton forum je constate qu'entre temps il y a une 3e colonne et, à voir le résultat, encore un tableau de plus d'imbriqué dedans.





Faline

Faline
Membre habitué

Féminin
Messages : 1480
Inscrit(e) le : 16/08/2006

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

Résolu Re: Qui est en ligne en deux colonnes

Message par Shawn Gryffondor Ven 10 Nov 2017 - 2:47

Bonsoir Faline et merci pour ta réponse.
Effectivement je faisais d'autres essais en attendant une réponse ici mais j'ai repris le code posté ici.

Le deuxième tableau imbriqué dans la colonne de droite est donc le problème. Pourtant sans lui, les balises anniversaire et membres connectés au cours des dernières 24h sont hors de contrôle et s'affichent en dehors du tableau... (Comme tu peux le voir à présent sur le forum)

D'ailleurs j'ai cru comprendre que ces balises devaient toujours être entourées d'un table. Donc que faire ? Imbriquer un deuxième tableau également à gauche ?


J'ai essayé de nettoyer mon code en supprimant les doublons. D'ailleurs aucune idée de pourquoi je n'avais qu'un seul tr sachant qu'il en faut un par colonne. J'ai supprimé aussi le valign top avec le texte align puisqu'il est présent avant et que le justify ne fonctionne de toute façon pas.

Bref et maintenant c'est encore pire :-)

Code:
 <!-- BEGIN disable_viewonline -->
  <div class="QeelIMG"></div>
  <div class="QeelGIF"></div>
    <div class="Qeel">
<table class="groupes">
  <tr>
      <td valign="top">
  <div class="QeelGroupe">
  <center><a href="liendugroupe" class="gr1">Groupe 1</a>&nbsp;
  <a href="liendugroupe" class="gr2">Groupe 2</a>&nbsp;
        <a href="liendugroupe" class="gr3">Groupe 3</a>&nbsp;
  <a href="liendugroupe" class="gr4">Groupe 4</a>&nbsp;
  <a href="liendugroupe" class="gr5">Groupe 5</a>&nbsp;
        <a href="liendugroupe" class="gr6">Groupe 6</a></center>
  </div>
    </td></tr>
      </table>
      <br/>
<div class="Qeel">
  <table style="width: 100%; border-collapse:collapse;">
      <tr>
        <td width: 150px>
                          <div style="float: left; padding-left: 50px; padding-right: 100px;">
              <span class="gensmall" id="totalusers"> {TOTAL_USERS}
        <script type="text/javascript">document.getElementById('totalusers').innerHTML=document.getElementById ('totalusers').innerHTML.replace(/Nous avons/,"Le monde magique comptabilise");</script>
        <script type="text/javascript">document.getElementById('totalusers').innerHTML=document.getElementById ('totalusers').innerHTML.replace(/membre enregistré/,"sorcier");</script>
                <script type="text/javascript">document.getElementById('totalusers').innerHTML=document.getElementById ('totalusers').innerHTML.replace(/membres enregistrés/,"sorciers");</script></span>
              <span class="gensmall" id="totalposts"> {TOTAL_POSTS}
        <script type="text/javascript">document.getElementById('totalposts').innerHTML=document.getElementById ('totalposts').innerHTML.replace(/Nos membres ont posté un total de/,"qui ont écrit");</script>
        <script type="text/javascript">document.getElementById('totalposts').innerHTML=document.getElementById ('totalposts').innerHTML.replace(/message/,"missive");</script>
              <script type="text/javascript">document.getElementById('totalposts').innerHTML=document.getElementById ('totalposts').innerHTML.replace(/messages/,"missives");</script></span>
          <br /> <br />
       
                    <span class="gensmall" id="newestuser"> {NEWEST_USER}
        <script type="text/javascript">document.getElementById('newestuser').innerHTML=document.getElementById ('newestuser').innerHTML.replace(/L'utilisateur enregistré le plus récent est/,"Le dernier sorcier à avoir rejoint la communauté s'appelle");</script>
        <script type="text/javascript">document.getElementById('newestuser').innerHTML=document.getElementById ('newestuser').innerHTML.replace(//,"");</script>
              <script type="text/javascript">document.getElementById('newestuser').innerHTML=document.getElementById ('newestuser').innerHTML.replace(//,"");</script></span>
       
            <br /> <br />
              <span class="gensmall" id="totaluseronline"> {TOTAL_USERS_ONLINE}
        <script type="text/javascript">document.getElementById('totaluseronline').innerHTML=document.getElementById ('totaluseronline').innerHTML.replace(/Il y a en tout/,"Il y a actuellement");</script>
          <script type="text/javascript">document.getElementById('totaluseronline').innerHTML=document.getElementById ('totaluseronline').innerHTML.replace(/utilisateur en ligne/,"sorcier en ligne");</script>
        <script type="text/javascript">document.getElementById('totaluseronline').innerHTML=document.getElementById ('totaluseronline').innerHTML.replace(/utilisateurs en ligne/,"sorciers en ligne");</script>
        <script type="text/javascript">document.getElementById('totaluseronline').innerHTML=document.getElementById('totaluseronline').innerHTML.replace(/Enregistré/,"recensé par le ministère");</script>
        <script type="text/javascript">document.getElementById('totaluseronline').innerHTML=document.getElementById('totaluseronline').innerHTML.replace(/Enregistrés/,"recensés par le ministère");</script>
        <script type="text/javascript">document.getElementById('totaluseronline').innerHTML=document.getElementById('totaluseronline').innerHTML.replace(/Invisible/,"utilise une cape d'invisibilité");</script>
        <script type="text/javascript">document.getElementById('totaluseronline').innerHTML=document.getElementById('totaluseronline').innerHTML.replace(/Invisibles/,"utilisent une cape d'invisibilité");</script>
        <script type="text/javascript">document.getElementById('totaluseronline').innerHTML=document.getElementById('totaluseronline').innerHTML.replace(/Invité/,"est placé sous le sortilège de la trace");</script>
        <script type="text/javascript">document.getElementById('totaluseronline').innerHTML=document.getElementById('totaluseronline').innerHTML.replace(/Invités/,"sont placés sous le sortilège de la trace");</script></span> 
                <br /> <br />
       
        <span class="gensmall" id="loggedinuserlist"> {LOGGED_IN_USER_LIST}
        <script type="text/javascript">document.getElementById('loggedinuserlist').innerHTML=document.getElementById ('loggedinuserlist').innerHTML.replace(/Utilisateurs enregistrés/,"Sorciers en quête");</script></span>
            </div>
        </td> 
    </tr>

    <tr>
        <td width: 150px>
                        <div style="float: right; padding-right: 50px; padding-left: 100px;">
        <span class="gensmall" id="anniv">{L_WHOSBIRTHDAY_TODAY}</span>
        <script type="text/javascript">document.getElementById('anniv').parentNode.innerHTML=document.getElementById('anniv').parentNode.innerHTML.replace(/Membres fêtant leur anniversaire aujourd'hui/,"Harry Potter Univers souhaite un bon anniversaire à").replace(/Aucun membre ne fête son anniversaire aujourd'hui/,"Aucun sorcier ne célèbre son anniversaire aujourd'hui");</script>
                                <br/>
        <span class="gensmall" id="connectedmembers">{L_CONNECTED_MEMBERS}</span>
        <script type="text/javascript">document.getElementById('connectedmembers').innerHTML=document.getElementById('connectedmembers').innerHTML.replace(/Membres connectés au cours des 24 dernières heures :/,"Sorciers connectés depuis la dernière lune :");</script>
                        </div>
     </td>
    </tr>
       
  </table>
</div>
<!-- END disable_viewonline -->

J'ai mis la balise Qeel en CSS avec la taille de police et le justify en important. Ça lui fait ni chaud ni froid...
avatar

Shawn Gryffondor
****

Masculin
Messages : 353
Inscrit(e) le : 03/01/2008

http://harrypotter-univers.forumactif.com/
Shawn Gryffondor a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Qui est en ligne en deux colonnes

Message par Faline Ven 10 Nov 2017 - 4:24

Shawn Gryffondor a écrit:Le deuxième tableau imbriqué dans la colonne de droite est donc le problème. Pourtant sans lui, les balises anniversaire et membres connectés au cours des dernières 24h sont hors de contrôle et s'affichent en dehors du tableau... (Comme tu peux le voir à présent sur le forum)
A l'heure qu'il est, il y a deux colonnes et qui se portent pas mal bien.
Shawn Gryffondor a écrit:D'ailleurs j'ai cru comprendre que ces balises devaient toujours être entourées d'un table. Donc que faire ? Imbriquer un deuxième tableau également à gauche ?
Il n'y a pas besoin d'imbrication. Un seul tableau avec une ligne et 2 cellules suffit (ou 3 cellules si tu veux faire comme tout à l'heure).
Shawn Gryffondor a écrit:D'ailleurs aucune idée de pourquoi je n'avais qu'un seul tr sachant qu'il en faut un par colonne.
On a besoin d'un <tr></tr> par ligne, donc une seule fois pour ton tableau Qeel.

Voir http://www.startyourdev.com/html/tag-html-balise-table

Je suis déjà bien fatiguée ce soir, mais voici une version qui pourrait être mieux alignée j'espère (un seul tableau avec une seule ligne et deux cellules), encore sans tenir compte de la taille de police, qui pourra peut-être se régler au niveau de la feuille de styles. Il manque encore le cellspacing/cellpadding, à mettre dans la balise <table>.

Code:
<!-- BEGIN disable_viewonline -->
<div class="Qeel">
<table class="groupes">
<tr>
<td valign="top">
<div class="QeelGroupe">
<center><a href="liendugroupe" class="gr1">Groupe 1</a>&nbsp;
<a href="liendugroupe" class="gr2">Groupe 2</a>&nbsp;
<a href="liendugroupe" class="gr3">Groupe 3</a>&nbsp;
<a href="liendugroupe" class="gr4">Groupe 4</a>&nbsp;
<a href="liendugroupe" class="gr5">Groupe 5</a>&nbsp;
<a href="liendugroupe" class="gr6">Groupe 6</a></center>
</div>
</td></tr>
</table>

<div class="Qeel">
<table style="width: 100%; border-collapse:collapse;">
<tr>
<td style="valign:top;" width="50%">
<div style="text-align: justify;">
<span class="gensmall" id="totalusers"> {TOTAL_USERS}
<script type="text/javascript">document.getElementById('totalusers').innerHTML=document.getElementById ('totalusers').innerHTML.replace(/Nous avons/,"Le monde magique comptabilise");</script>
<script type="text/javascript">document.getElementById('totalusers').innerHTML=document.getElementById ('totalusers').innerHTML.replace(/membre enregistré/,"sorcier");</script>
<script type="text/javascript">document.getElementById('totalusers').innerHTML=document.getElementById ('totalusers').innerHTML.replace(/membres enregistrés/,"sorciers");</script></span>
<span class="gensmall" id="totalposts"> {TOTAL_POSTS}
<script type="text/javascript">document.getElementById('totalposts').innerHTML=document.getElementById ('totalposts').innerHTML.replace(/Nos membres ont posté un total de/,"qui ont écrit");</script>
<script type="text/javascript">document.getElementById('totalposts').innerHTML=document.getElementById ('totalposts').innerHTML.replace(/message/,"missive");</script>
<script type="text/javascript">document.getElementById('totalposts').innerHTML=document.getElementById ('totalposts').innerHTML.replace(/messages/,"missives");</script></span>
<br> <br>
<span class="gensmall" id="newestuser"> {NEWEST_USER}
<script type="text/javascript">document.getElementById('newestuser').innerHTML=document.getElementById ('newestuser').innerHTML.replace(/L'utilisateur enregistré le plus récent est/,"Le dernier sorcier à avoir rejoint la communauté s'appelle");</script>
<script type="text/javascript">document.getElementById('newestuser').innerHTML=document.getElementById ('newestuser').innerHTML.replace(//,"");</script>
<script type="text/javascript">document.getElementById('newestuser').innerHTML=document.getElementById ('newestuser').innerHTML.replace(//,"");</script></span><br> <br>
<span class="gensmall" id="totaluseronline"> {TOTAL_USERS_ONLINE}
<script type="text/javascript">document.getElementById('totaluseronline').innerHTML=document.getElementById ('totaluseronline').innerHTML.replace(/Il y a en tout/,"Il y a actuellement");</script>
<script type="text/javascript">document.getElementById('totaluseronline').innerHTML=document.getElementById ('totaluseronline').innerHTML.replace(/utilisateur en ligne/,"sorcier en ligne");</script>
<script type="text/javascript">document.getElementById('totaluseronline').innerHTML=document.getElementById ('totaluseronline').innerHTML.replace(/utilisateurs en ligne/,"sorciers en ligne");</script>
<script type="text/javascript">document.getElementById('totaluseronline').innerHTML=document.getElementById('totaluseronline').innerHTML.replace(/Enregistré/,"recensé par le ministère");</script>
<script type="text/javascript">document.getElementById('totaluseronline').innerHTML=document.getElementById('totaluseronline').innerHTML.replace(/Enregistrés/,"recensés par le ministère");</script>
<script type="text/javascript">document.getElementById('totaluseronline').innerHTML=document.getElementById('totaluseronline').innerHTML.replace(/Invisible/,"utilise une cape d'invisibilité");</script>
<script type="text/javascript">document.getElementById('totaluseronline').innerHTML=document.getElementById('totaluseronline').innerHTML.replace(/Invisibles/,"utilisent une cape d'invisibilité");</script>
<script type="text/javascript">document.getElementById('totaluseronline').innerHTML=document.getElementById('totaluseronline').innerHTML.replace(/Invité/,"est placé sous le sortilège de la trace");</script>
<script type="text/javascript">document.getElementById('totaluseronline').innerHTML=document.getElementById('totaluseronline').innerHTML.replace(/Invités/,"sont placés sous le sortilège de la trace");</script></span><br> <br>
<span class="gensmall" id="loggedinuserlist"> {LOGGED_IN_USER_LIST}
        <script type="text/javascript">document.getElementById('loggedinuserlist').innerHTML=document.getElementById ('loggedinuserlist').innerHTML.replace(/Utilisateurs enregistrés/,"Sorciers en quête");</script></span></div>
</td>

<td style="vertical-align:top; text-align: justify;>
<div><span class="gensmall" id="anniv">{L_WHOSBIRTHDAY_TODAY}</span>
                    <script type="text/javascript">document.getElementById('anniv').parentNode.innerHTML=document.getElementById('anniv').parentNode.innerHTML.replace(/Membres fêtant leur anniversaire aujourd'hui/,"Harry Potter Univers souhaite un bon anniversaire à").replace(/Aucun membre ne fête son anniversaire aujourd'hui/,"Aucun sorcier ne célèbre son anniversaire aujourd'hui");</script>
<br>
<span class="gensmall">{L_CONNECTED_MEMBERS}</span>
<script type="text/javascript">document.getElementById('test').innerHTML=document.getElementById('test').innerHTML.replace(/Membres connectés au cours des 24 dernières heures :/,"Sorciers connectés depuis la dernière lune :");</script>
</div>
</td>
</tr>
</table>
</div>
<!-- END disable_viewonline -->

Sur mon programme de courriel ça fait :
qui est en ligne - Qui est en ligne en deux colonnes 111qee10
scratch sur deux forums test ça ne m'a fait aucun effet.

Edit : je viens de me rendre compte qu'il manque les deux sauts de ligne < /br>< /br> entre total_users et total_posts Rolling Eyes . A ajouter :
Code:
replace(/membres enregistrés/,"sorciers");</script></span>< /br>< /br>
<span class="gensmall" id="totalposts"> {TOTAL_POSTS}


Faline

Faline
Membre habitué

Féminin
Messages : 1480
Inscrit(e) le : 16/08/2006

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

Résolu Re: Qui est en ligne en deux colonnes

Message par Shawn Gryffondor Ven 10 Nov 2017 - 15:30

Hello !

Je suis désolé ton code ne fonctionne pas. Tu ouvres une balise div class qeel dans la première table puis ré ouvre la même dans la deuxième table sans fermer la première ?

J'ai la fin de mon code qui est tout rouge, j'ai essayé de réparer mais rien n'y fait.
L'absence de saut de ligne est voulu, c'est une phrase personnalisée.

En tout cas, les balises anniversaire et membres connectés au cours des dernières 24h sont en dehors du tableau et la reformulation n'est pas prise en compte :/

Pour le reste cellpadding et taille de police je pense qu'on peut voir ça après.

Code:
<!-- BEGIN disable_viewonline -->
<div class="Qeel">
<table class="groupes">
   <tr>
      <td valign="top">
         <div class="QeelGroupe">
            <center><a href="liendugroupe" class="gr1">Groupe 1</a>&nbsp;
            <a href="liendugroupe" class="gr2">Groupe 2</a>&nbsp;
            <a href="liendugroupe" class="gr3">Groupe 3</a>&nbsp;
            <a href="liendugroupe" class="gr4">Groupe 4</a>&nbsp;
            <a href="liendugroupe" class="gr5">Groupe 5</a>&nbsp;
            <a href="liendugroupe" class="gr6">Groupe 6</a></center>
         </div>
      </td></tr>
</table>

   <table style="width: 100%; border-collapse:collapse;">
      <tr>
         <td style="valign:top;" width="50%">
            <div style="text-align: justify;">
               <span class="gensmall" id="totalusers"> {TOTAL_USERS}
               <script type="text/javascript">document.getElementById('totalusers').innerHTML=document.getElementById ('totalusers').innerHTML.replace(/Nous avons/,"Le monde magique comptabilise");</script>
               <script type="text/javascript">document.getElementById('totalusers').innerHTML=document.getElementById ('totalusers').innerHTML.replace(/membre enregistré/,"sorcier");</script>
               <script type="text/javascript">document.getElementById('totalusers').innerHTML=document.getElementById ('totalusers').innerHTML.replace(/membres enregistrés/,"sorciers");</script></span>
               <span class="gensmall" id="totalposts"> {TOTAL_POSTS}
               <script type="text/javascript">document.getElementById('totalposts').innerHTML=document.getElementById ('totalposts').innerHTML.replace(/Nos membres ont posté un total de/,"qui ont écrit");</script>
               <script type="text/javascript">document.getElementById('totalposts').innerHTML=document.getElementById ('totalposts').innerHTML.replace(/message/,"missive");</script>
               <script type="text/javascript">document.getElementById('totalposts').innerHTML=document.getElementById ('totalposts').innerHTML.replace(/messages/,"missives");</script></span>
<br> <br>
               <span class="gensmall" id="newestuser"> {NEWEST_USER}
               <script type="text/javascript">document.getElementById('newestuser').innerHTML=document.getElementById ('newestuser').innerHTML.replace(/L'utilisateur enregistré le plus récent est/,"Le dernier sorcier à avoir rejoint la communauté s'appelle");</script>
               <script type="text/javascript">document.getElementById('newestuser').innerHTML=document.getElementById ('newestuser').innerHTML.replace(//,"");</script>
               <script type="text/javascript">document.getElementById('newestuser').innerHTML=document.getElementById ('newestuser').innerHTML.replace(//,"");</script></span>
<br> <br>

               <span class="gensmall" id="totaluseronline"> {TOTAL_USERS_ONLINE}
               <script type="text/javascript">document.getElementById('totaluseronline').innerHTML=document.getElementById ('totaluseronline').innerHTML.replace(/Il y a en tout/,"Il y a actuellement");</script>
               <script type="text/javascript">document.getElementById('totaluseronline').innerHTML=document.getElementById ('totaluseronline').innerHTML.replace(/utilisateur en ligne/,"sorcier en ligne");</script>
               <script type="text/javascript">document.getElementById('totaluseronline').innerHTML=document.getElementById ('totaluseronline').innerHTML.replace(/utilisateurs en ligne/,"sorciers en ligne");</script>
               <script type="text/javascript">document.getElementById('totaluseronline').innerHTML=document.getElementById('totaluseronline').innerHTML.replace(/Enregistré/,"recensé par le ministère");</script>
               <script type="text/javascript">document.getElementById('totaluseronline').innerHTML=document.getElementById('totaluseronline').innerHTML.replace(/Enregistrés/,"recensés par le ministère");</script>
               <script type="text/javascript">document.getElementById('totaluseronline').innerHTML=document.getElementById('totaluseronline').innerHTML.replace(/Invisible/,"utilise une cape d'invisibilité");</script>
               <script type="text/javascript">document.getElementById('totaluseronline').innerHTML=document.getElementById('totaluseronline').innerHTML.replace(/Invisibles/,"utilisent une cape d'invisibilité");</script>
               <script type="text/javascript">document.getElementById('totaluseronline').innerHTML=document.getElementById('totaluseronline').innerHTML.replace(/Invité/,"est placé sous le sortilège de la trace");</script>
               <script type="text/javascript">document.getElementById('totaluseronline').innerHTML=document.getElementById('totaluseronline').innerHTML.replace(/Invités/,"sont placés sous le sortilège de la trace");</script></span>
<br> <br>
               
                 <span class="gensmall" id="loggedinuserlist"> {LOGGED_IN_USER_LIST}
                    <script type="text/javascript">document.getElementById('loggedinuserlist').innerHTML=document.getElementById ('loggedinuserlist').innerHTML.replace(/Utilisateurs enregistrés/,"Sorciers en quête");</script></span>
              </div>
         </td>

<td style="vertical-align:top; text-align: justify;>
   <div>
               <span class="gensmall" id="anniv">{L_WHOSBIRTHDAY_TODAY}</span>
                             <script type="text/javascript">document.getElementById('anniv').parentNode.innerHTML=document.getElementById('anniv').parentNode.innerHTML.replace(/Membres fêtant leur anniversaire aujourd'hui/,"Harry Potter Univers souhaite un bon anniversaire à").replace(/Aucun membre ne fête son anniversaire aujourd'hui/,"Aucun sorcier ne célèbre son anniversaire aujourd'hui");</script>
<br>
               <span class="gensmall" id="connectedmembers">{L_CONNECTED_MEMBERS}</span>
               <script type="text/javascript">document.getElementById('connectedmembers').innerHTML=document.getElementById('connectedmembers').innerHTML.replace(/Membres connectés au cours des 24 dernières heures :/,"Sorciers connectés depuis la dernière lune :");</script>
   </div>
</td>
      </tr>
   </table>
</div>

<!-- END disable_viewonline -->
avatar

Shawn Gryffondor
****

Masculin
Messages : 353
Inscrit(e) le : 03/01/2008

http://harrypotter-univers.forumactif.com/
Shawn Gryffondor a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Qui est en ligne en deux colonnes

Message par Faline Ven 10 Nov 2017 - 16:31

Tu es parti de quel tutoriel ?

Là il y en a un qui a l'air pas mal (mais certainement pas le seul) : https://forum.forumactif.com/t316484-qeel-en-deux-colonnes . Là aussi il est question de tableaux de trop à effacer d'abord, comme il me semblait aussi...

Chez toi, les groupes semblent être déjà en ordre.

Edit : je viens de faire le tuto ci-dessus chez moi. Il fonctionne, mais donne exactement le petit décalage qui est l'objet de ce sujet scratch .

Pour la taille de police, j'ai trouvé un code intéressant (taille relative) : https://forum.forumactif.com/t284169-qeel-en-2-colonnes#2513985

::fleur:: J'espère que quelqu'un d'autre trouvera ce qui ne va pas. ::fleur::
Faline

Faline
Membre habitué

Féminin
Messages : 1480
Inscrit(e) le : 16/08/2006

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

Résolu Re: Qui est en ligne en deux colonnes

Message par Shawn Gryffondor Ven 10 Nov 2017 - 21:33

J'étais parti d'un tutoriel officiel du site Never-Utopia si tu connais.

J'ai tout refait avec le lien que tu m'as donné. Le problème persiste. Le léger décalage de début entre la première et la deuxième colonne et l'absence de mes balises membres fêtant leur anniversaire les 7 prochains jours et les membres connectés les dernières 24 heures.

Code:
<!-- BEGIN disable_viewonline -->
  <div class="QeelIMG"></div>
  <div class="QeelGIF"></div>
    <div class="Qeel">
     
<table class="forumline" width="100%" border="0" cellspacing="1" cellpadding="0" style="padding-left: 40px;">
  <tr>
          <td width="50%" style="padding-right: 40px;">
                <span class="gensmall" id="totalusers"> {TOTAL_USERS}
         <script type="text/javascript">document.getElementById('totalusers').innerHTML=document.getElementById ('totalusers').innerHTML.replace(/Nous avons/,"Le monde magique comptabilise");</script>
         <script type="text/javascript">document.getElementById('totalusers').innerHTML=document.getElementById ('totalusers').innerHTML.replace(/membre enregistré/,"sorcier");</script>
                <script type="text/javascript">document.getElementById('totalusers').innerHTML=document.getElementById ('totalusers').innerHTML.replace(/membres enregistrés/,"sorciers");</script></span>
               <span class="gensmall" id="totalposts"> {TOTAL_POSTS}
         <script type="text/javascript">document.getElementById('totalposts').innerHTML=document.getElementById ('totalposts').innerHTML.replace(/Nos membres ont posté un total de/,"qui ont écrit");</script>
         <script type="text/javascript">document.getElementById('totalposts').innerHTML=document.getElementById ('totalposts').innerHTML.replace(/message/,"missive");</script>
              <script type="text/javascript">document.getElementById('totalposts').innerHTML=document.getElementById ('totalposts').innerHTML.replace(/messages/,"missives");</script></span>

      <br />
       
                    <span class="gensmall" id="newestuser"> {NEWEST_USER}
         <script type="text/javascript">document.getElementById('newestuser').innerHTML=document.getElementById ('newestuser').innerHTML.replace(/L'utilisateur enregistré le plus récent est/,"Le dernier sorcier à avoir rejoint la communauté s'appelle");</script>
         <script type="text/javascript">document.getElementById('newestuser').innerHTML=document.getElementById ('newestuser').innerHTML.replace(//,"");</script>
              <script type="text/javascript">document.getElementById('newestuser').innerHTML=document.getElementById ('newestuser').innerHTML.replace(//,"");</script></span>
       
            <br /> <br />
              <span class="gensmall" id="totaluseronline"> {TOTAL_USERS_ONLINE}
         <script type="text/javascript">document.getElementById('totaluseronline').innerHTML=document.getElementById ('totaluseronline').innerHTML.replace(/Il y a en tout/,"Il y a actuellement");</script>
           <script type="text/javascript">document.getElementById('totaluseronline').innerHTML=document.getElementById ('totaluseronline').innerHTML.replace(/utilisateur en ligne/,"sorcier en ligne");</script>
         <script type="text/javascript">document.getElementById('totaluseronline').innerHTML=document.getElementById ('totaluseronline').innerHTML.replace(/utilisateurs en ligne/,"sorciers en ligne");</script>
         <script type="text/javascript">document.getElementById('totaluseronline').innerHTML=document.getElementById('totaluseronline').innerHTML.replace(/Enregistré/,"recensé par le ministère");</script>
         <script type="text/javascript">document.getElementById('totaluseronline').innerHTML=document.getElementById('totaluseronline').innerHTML.replace(/Enregistrés/,"recensés par le ministère");</script>
         <script type="text/javascript">document.getElementById('totaluseronline').innerHTML=document.getElementById('totaluseronline').innerHTML.replace(/Invisible/,"utilise une cape d'invisibilité");</script>
         <script type="text/javascript">document.getElementById('totaluseronline').innerHTML=document.getElementById('totaluseronline').innerHTML.replace(/Invisibles/,"utilisent une cape d'invisibilité");</script>
         <script type="text/javascript">document.getElementById('totaluseronline').innerHTML=document.getElementById('totaluseronline').innerHTML.replace(/Invité/,"est placé sous le sortilège de la trace");</script>
         <script type="text/javascript">document.getElementById('totaluseronline').innerHTML=document.getElementById('totaluseronline').innerHTML.replace(/Invités/,"sont placés sous le sortilège de la trace");</script></span> 
                <br /> <br />
       
         <span class="gensmall" id="loggedinuserlist"> {LOGGED_IN_USER_LIST}
         <script type="text/javascript">document.getElementById('loggedinuserlist').innerHTML=document.getElementById ('loggedinuserlist').innerHTML.replace(/Utilisateurs enregistrés/,"Sorciers en quête");</script></span>
       </td>
   
  <td valign="top" style="padding-left: 40px;">
  <table>
             <span class="gensmall" id="anniv">{L_WHOSBIRTHDAY_TODAY}</span>
         <script type="text/javascript">document.getElementById('anniv').parentNode.innerHTML=document.getElementById('anniv').parentNode.innerHTML.replace(/Membres fêtant leur anniversaire aujourd'hui/,"Harry Potter Univers souhaite un bon anniversaire à").replace(/Aucun membre ne fête son anniversaire aujourd'hui/,"Aucun sorcier ne célèbre son anniversaire aujourd'hui");</script>
          <br/>
                        <span class="gensmall" id="annivweek">{L_WHOSBIRTHDAY_WEEK}</span>
             <script type="text/javascript">document.getElementById('annivweek').parentNode.innerHTML=document.getElementById('annivweek').parentNode.innerHTML.replace(/Membres fêtant leur anniversaire dans les 7 prochains jours/,"Sorciers fêtant leur anniversaire dans les 7 prochains jours").replace(/Aucun membre ne célèbre son anniversaire dans les 7 prochains jours/,"Aucun sorcier ne célèbre son anniversaire dansles 7 prochains jours");</script>
          <br/>
                  <span class="gensmall" id="connectedmembers">{L_CONNECTED_MEMBERS}</span>
           <script type="text/javascript">document.getElementById('connectedmembers').innerHTML=document.getElementById('connectedmembers').innerHTML.replace(/Membres connectés au cours des 24 dernières heures :/,"Sorciers connectés depuis la dernière lune :");</script>
  </table>
  </td></tr>
 
</table>

      <br/>
<table class="groupes">
  <tr>
      <td valign="top">
  <div class="QeelGroupe">
  <center><a href="liendugroupe" class="gr1">Groupe 1</a>&nbsp;
  <a href="liendugroupe" class="gr2">Groupe 2</a>&nbsp;
        <a href="liendugroupe" class="gr3">Groupe 3</a>&nbsp;
  <a href="liendugroupe" class="gr4">Groupe 4</a>&nbsp;
  <a href="liendugroupe" class="gr5">Groupe 5</a>&nbsp;
        <a href="liendugroupe" class="gr6">Groupe 6</a></center>
  </div>
    </td></tr>
      </table>
<!-- END disable_viewonline -->

Quand je rajoute un TD entre toutes mes balises de la deuxième colonne, celles-ci apparaissent enfin sur le forum mais avec un gros espace en sur le haut et la personnalisation du texte n'est pas prise en compte.

Si quelqu'un a déjà eu le problème...
Merci tout de même Faline de t'être penchée sur mon cas Wink
avatar

Shawn Gryffondor
****

Masculin
Messages : 353
Inscrit(e) le : 03/01/2008

http://harrypotter-univers.forumactif.com/
Shawn Gryffondor a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Qui est en ligne en deux colonnes

Message par Faline Ven 10 Nov 2017 - 23:52

Shawn Gryffondor a écrit:J'étais parti d'un tutoriel officiel du site Never-Utopia si tu connais.
J' en ai déjà entendu parler et je suis allée voir comme invitée (pas de liens pour les invités, donc pas de code). J'y ai vu un tuto que j'ai déjà croisé sur le forum ici (la personne demandait à éloigner le trait au milieu des groupes) et qui a le même défaut :
qui est en ligne - Qui est en ligne en deux colonnes Aligne10
Est-ce celui-là, ton tuto ?



Faline

Faline
Membre habitué

Féminin
Messages : 1480
Inscrit(e) le : 16/08/2006

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

Résolu Re: Qui est en ligne en deux colonnes

Message par Shawn Gryffondor Sam 11 Nov 2017 - 13:01

J'avais fait mon codage à partir de ce tutoriel : Lien tutoriel
Qui présente d'ailleurs le même décalage également.
avatar

Shawn Gryffondor
****

Masculin
Messages : 353
Inscrit(e) le : 03/01/2008

http://harrypotter-univers.forumactif.com/
Shawn Gryffondor a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Qui est en ligne en deux colonnes

Message par Faline Sam 11 Nov 2017 - 15:14

Merci pour le tuto.
As-tu essayé de commencer la première cellule avec un paragraphe/div d'une seule ligne, en lui appliquant un line-height de quelques px de plus que sur le reste du tableau ?

http://www.startyourdev.com/css/style-css-line-height

ou insérer sur la première ligne de la première cellule une image transparente de la hauteur adéquate (1 px de large). Ou une première colonne avec juste une image centrée en hauteur pour qu'on ne voie pas le défaut.

Le défaut n'est en tout cas inhérent ni au forum ni au navigateur...
Ce que j'ai fait : au-dessus du qeel j'ai aménagé un tableau tout simple de 3 colonnes (en laissant les styles par défaut) Arrow pas de problème d'alignement horizontal :
qui est en ligne - Qui est en ligne en deux colonnes Lorem10
Maintenant il faudrait petite étape par petite étape transborder/introduire le contenu...


Faline

Faline
Membre habitué

Féminin
Messages : 1480
Inscrit(e) le : 16/08/2006

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

Résolu Re: Qui est en ligne en deux colonnes

Message par Shawn Gryffondor Sam 11 Nov 2017 - 22:36

J'ai essayé mais ça ne fonctionne pas. Ce n'est pas grave, la différence n'est presque pas visible, je vais m'en accommoder.

Par contre ce que je ne comprends pas, c'est mes balises Anniversaire et Membres connectés qui ne prennent pas en compte mes modifications de phrase. Une idée Faline ?

Merci

Code:
<!-- BEGIN disable_viewonline -->
  <div class="QeelIMG"></div>
    <div class="Qeel">
     
<table class="forumlineqeel" width="100%" border="0" cellspacing="0" cellpadding="0" style="padding-left: 40px;" style="padding-right: 40px;">
  <tr>
          <td id="stats" width="50%" style="padding-right: 60px;">
            <br />
                <span class="gensmall" id="totalusers"> {TOTAL_USERS}
         <script type="text/javascript">document.getElementById('totalusers').innerHTML=document.getElementById ('totalusers').innerHTML.replace(/Nous avons/,"Le monde magique comptabilise");</script>
         <script type="text/javascript">document.getElementById('totalusers').innerHTML=document.getElementById ('totalusers').innerHTML.replace(/membre enregistré/,"sorcier");</script>
                <script type="text/javascript">document.getElementById('totalusers').innerHTML=document.getElementById ('totalusers').innerHTML.replace(/membres enregistrés/,"sorciers");</script></span>
               <span class="gensmall" id="totalposts"> {TOTAL_POSTS}
         <script type="text/javascript">document.getElementById('totalposts').innerHTML=document.getElementById ('totalposts').innerHTML.replace(/Nos membres ont posté un total de/,"qui ont écrit");</script>
         <script type="text/javascript">document.getElementById('totalposts').innerHTML=document.getElementById ('totalposts').innerHTML.replace(/message/,"missive");</script>
              <script type="text/javascript">document.getElementById('totalposts').innerHTML=document.getElementById ('totalposts').innerHTML.replace(/messages/,"missives");</script></span>

      <br />
       
                    <span class="gensmall" id="newestuser"> {NEWEST_USER}
         <script type="text/javascript">document.getElementById('newestuser').innerHTML=document.getElementById ('newestuser').innerHTML.replace(/L'utilisateur enregistré le plus récent est/,"Le dernier sorcier à avoir rejoint la communauté s'appelle");</script></span>
               <br />
                        <span class="gensmall" id="recordusers"> {RECORD_USERS}
         <script type="text/javascript">document.getElementById('recordusers').innerHTML=document.getElementById ('recordusers').innerHTML.replace(/Le record du nombre d'utilisateurs en ligne est de/,"Le record du nombre de sorciers en ligne est de");</script></span>

            <br /> <br />
              <span class="gensmall" id="totaluseronline"> {TOTAL_USERS_ONLINE}
         <script type="text/javascript">document.getElementById('totaluseronline').innerHTML=document.getElementById ('totaluseronline').innerHTML.replace(/Il y a en tout/,"Il y a actuellement");</script>
           <script type="text/javascript">document.getElementById('totaluseronline').innerHTML=document.getElementById ('totaluseronline').innerHTML.replace(/utilisateur en ligne/,"sorcier en ligne");</script>
         <script type="text/javascript">document.getElementById('totaluseronline').innerHTML=document.getElementById ('totaluseronline').innerHTML.replace(/utilisateurs en ligne/,"sorciers en ligne");</script>
         <script type="text/javascript">document.getElementById('totaluseronline').innerHTML=document.getElementById('totaluseronline').innerHTML.replace(/Enregistré/,"recensé par le ministère");</script>
         <script type="text/javascript">document.getElementById('totaluseronline').innerHTML=document.getElementById('totaluseronline').innerHTML.replace(/Enregistrés/,"recensés par le ministère");</script>
         <script type="text/javascript">document.getElementById('totaluseronline').innerHTML=document.getElementById('totaluseronline').innerHTML.replace(/Invisible/,"utilise une cape d'invisibilité");</script>
         <script type="text/javascript">document.getElementById('totaluseronline').innerHTML=document.getElementById('totaluseronline').innerHTML.replace(/Invisibles/,"utilisent une cape d'invisibilité");</script>
         <script type="text/javascript">document.getElementById('totaluseronline').innerHTML=document.getElementById('totaluseronline').innerHTML.replace(/Invité/,"est placé sous le sortilège de la trace");</script>
         <script type="text/javascript">document.getElementById('totaluseronline').innerHTML=document.getElementById('totaluseronline').innerHTML.replace(/Invités/,"sont placés sous le sortilège de la trace");</script></span> 
                <br /> <br />
       
         <span class="gensmall" id="loggedinuserlist"> {LOGGED_IN_USER_LIST}
         <script type="text/javascript">document.getElementById('loggedinuserlist').innerHTML=document.getElementById ('loggedinuserlist').innerHTML.replace(/Utilisateurs enregistrés/,"Sorciers en quête");</script></span>
<br />
       </td>

  <td id="stats" valign="top" style="padding-left: 20px;">
  <table style="padding-right: 40px;">
    <br />
    <div>
             <span class="gensmall" id="anniv">{L_WHOSBIRTHDAY_TODAY}</span>
         <script type="text/javascript">document.getElementById('anniv').parentNode.innerHTML=document.getElementById('anniv').parentNode.innerHTML.replace(/Membres fêtant leur anniversaire aujourd'hui/,"Harry Potter Univers souhaite un bon anniversaire à").replace(/Aucun membre ne fête son anniversaire aujourd'hui/,"Aucun sorcier ne célèbre son anniversaire aujourd'hui");</script>
  </div>
  <div>
                        <span class="gensmall" id="annivweek">{L_WHOSBIRTHDAY_WEEK}</span>
             <script type="text/javascript">document.getElementById('annivweek').parentNode.innerHTML=document.getElementById('annivweek').parentNode.innerHTML.replace(/Membres fêtant leur anniversaire dans les 7 prochains jours/,"Sorciers fêtant leur anniversaire dans les 7 prochains jours").replace(/Aucun membre ne célèbre son anniversaire dans les 7 prochains jours/,"Aucun sorcier ne célèbre son anniversaire dansles 7 prochains jours");</script>
  </div>
  <div>
                  <span class="gensmall" id="connectedmembers">{L_CONNECTED_MEMBERS}</span>
           <script type="text/javascript">document.getElementById('connectedmembers').innerHTML=document.getElementById('connectedmembers').innerHTML.replace(/Membres connectés au cours des 24 dernières heures :/,"Sorciers connectés depuis la dernière lune :");</script>
  </div>
    </table>
  </td></tr>
 
</table>
<table class="groupes">
  <tr>
      <td valign="top">
  <div class="QeelGroupe">
  <center>
  <div width= "1000px";>
     <a href="liendugroupe" class="gr1">Staff</a>&nbsp;
     <a href="liendugroupe" class="gr2">Serdaigle</a>&nbsp;
        <a href="liendugroupe" class="gr3">Gryffondor</a>&nbsp;
     <a href="liendugroupe" class="gr4">Poufsouffle</a>&nbsp;
     <a href="liendugroupe" class="gr5">Serpentard</a>&nbsp;
       <a href="liendugroupe" class="gr6">Poudlard</a>&nbsp;
    </div>&nbsp;
    <div width= "1000px";>
         <a href="liendugroupe" class="gr7">Gringotts</a>&nbsp;
         <a href="liendugroupe" class="gr8">Commerçant</a>&nbsp;
         <a href="liendugroupe" class="gr9">Auror</a>&nbsp;
         <a href="liendugroupe" class="gr10">Ministère de la magie</a>&nbsp;
         <a href="liendugroupe" class="gr11">Hôpital Ste Mangouste</a>&nbsp;
        <a href="liendugroupe" class="gr12">Autre</a>&nbsp;
    </div>
    </center>
  </div>
    </td></tr>
      </table>
</div>
<!-- END disable_viewonline -->
avatar

Shawn Gryffondor
****

Masculin
Messages : 353
Inscrit(e) le : 03/01/2008

http://harrypotter-univers.forumactif.com/
Shawn Gryffondor a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Qui est en ligne en deux colonnes

Message par Faline Dim 12 Nov 2017 - 0:55

Shawn Gryffondor a écrit:J'ai essayé mais ça ne fonctionne pas. Ce n'est pas grave, la différence n'est presque pas visible, je vais m'en accommoder.
Un simple tableau d'une ligne et 2/3 cellules avec un peu de texte ne marche pas ? Shocked . A quoi est-ce que ça ressemble en copie d'écran ?

Chez moi, le début fait bien aligné :
qui est en ligne - Qui est en ligne en deux colonnes Sorcie10

... et en ::fleur:: style="font-size:20px"; ::fleur:: ça donne :
qui est en ligne - Qui est en ligne en deux colonnes 20px10

et en ::fleur:: style="font-size:16px; color:#AEAEAE"; ::fleur:: ça fait :
qui est en ligne - Qui est en ligne en deux colonnes Couleu10
...

Remarques :


Les annifs et connectés donnent du fil à retordre de façon générale, p. ex.



Faline

Faline
Membre habitué

Féminin
Messages : 1480
Inscrit(e) le : 16/08/2006

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

Résolu Re: Qui est en ligne en deux colonnes

Message par Shawn Gryffondor Dim 12 Nov 2017 - 13:40

Finalement j'ai opté pour l'image transparente pour réduire l'espace, c'était une très bonne idée!

J'ai réussi à reformuler toutes mes balises donc c'est parfait. Merci beaucoup pour ton aide et les liens Faline.
Si jamais je peux mettre ton logo sur mon forum quand il sera ouvert, c'est avec plaisir Smile
avatar

Shawn Gryffondor
****

Masculin
Messages : 353
Inscrit(e) le : 03/01/2008

http://harrypotter-univers.forumactif.com/
Shawn Gryffondor 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