Probème mise en page du Queel.

[Totomi]

Bonjour, bonsoir,

Je refais en ce moment le design de mon forum et étant une quiche en ce qui concerne la mise en place de mes idées bien sûr, je n'arrive pas à obtenir ce que je souhaite.

Spoiler:

Comme vous pouvez le voir mon qui est en ligne a quelques problèmes, j'ai essayé de le bidouillé dans tout les sens mais rien à faire je vous explique donc mon idée en espérant que quelqu'un saura m'aider:

premièrement le texte tout comme l'image elle-même n'est pas centré alors que les balises y sont . Deuxièmement les connectés des 24 dernières heures se positionne sur un fond différent, alors que je voudrait qu'ils soient sur l'image en dessous du "qui joue avec moi" en fait. Également je voudrais séparer les anniversaires , en formant un cadre qui serait en dessous de l'image du qui est en ligne. Voila beaucoup de chose pour un qui est en ligne mais je m'en sortais plus, je poste donc le template et css:

Spoiler:

Spoiler:

[Totomi]

Un petit up .

[Totomi]

Je me permets un petit up , en avance d'une heure ne pouvant être là à minuit et mes problèmes s'accumulant devenant " urgents".

[Totomi]

De nouveau un petit up ^^

[Scoubifitz]

bonsoir,

remplacez la partie wiewonline par :

Code:

<!-- BEGIN disable_viewonline -->
<center>
  <table cellspacing="2" cellpadding="2" width="900"  class="statistiques">
    <tr>
      <td width="15%"> </td>
      <td><center><span class="groupes"><a href="http://yuugure-no-kaigi.forums-gratuits.fr/g3-vampires"><font color="#DB0B32" size="2"><b>Vampires</b></font></a></span>
<span class="groupes"><a href="http://yuugure-no-kaigi.forums-gratuits.fr/g4-humains"><font color="#B09F91" size="2"><b>Humains</b></font></a></span>
<span class="groupes"><a href="http://yuugure-no-kaigi.forums-gratuits.fr/g5-chasseurs-de-vampire"><font color="#714A4A" size="2"><b>Chasseurs de vampire</b></font></a></span>
<span class="groupes"><a href="http://yuugure-no-kaigi.forums-gratuits.fr/g6-extremistes"><font color="#183152" size="2"><b>Extrémistes</b></font></a></span><br><br><br><br><br>
<span class="gensmall">{TOTAL_POSTS}. {TOTAL_USERS}<br />
{NEWEST_USER}<br><br>
 
{TOTAL_USERS_ONLINE}<br>
{LOGGED_IN_USER_LIST}{TOTAL_CHATTERS_ONLINE}<br>
  {L_CONNECTED_MEMBERS}
</span></center><br>
</tr></table>
  <table class="birthday">
    <tr>
      <td><img src="http://www.kirikoo.net/images/7Hitomi-20120806-212956.png" /></td>
      <td><table>{L_WHOSBIRTHDAY_TODAY}{L_WHOSBIRTHDAY_WEEK}</td></tr></table>
  </td></tr></table></center>
<!-- END disable_viewonline -->

et le CSS par :

Code:

.statistiques{
background: url("http://www.kirikoo.net/images/7Hitomi-20120808-225827.png") no-repeat center;
height:442px;
}
 .groupes{
background-color:#ffffff;
height:40px;
padding:0 15px;
margin:0 8px;
font-size:15px;
font-weight: bold;
font-family: Georgia;
font-style: Italic;
text-align:center;
border: 2px dotted #696969;
}       
.groupes a{
text-decoration: none;
}       
.birthday{
width:600px;
margin:auto;
}       
.birthday .row1{
background:none;
}

[Totomi]

Merci de ta réponse mais cela ne fonctionne toujours pas les seuls changements sont que le fond des membres connecté depuis les 24 dernières heures à grandi et qu'il n'existe plus derrière les anniversaires.

[Anzu]

Bonjour,

Il manque les balises table autour de la variable concernée, comme ceci:

Code:

<table>{L_CONNECTED_MEMBERS}</table>

Pour le reste, je n'ai pas compris ce que vous vouliez faire.

Cordialement.

[Scoubifitz]

et comme ça ,

Code:

<!-- BEGIN disable_viewonline -->
<center>
<table cellspacing="2" cellpadding="2" width="900"  class="statistiques">
<tr>
<td width="15%" rowspan="2"> </td>
<td><center><span class="groupes"><a href="http://yuugure-no-kaigi.forums-gratuits.fr/g3-vampires"><font color="#DB0B32" size="2"><b>Vampires</b></font></a></span>
<span class="groupes"><a href="http://yuugure-no-kaigi.forums-gratuits.fr/g4-humains"><font color="#B09F91" size="2"><b>Humains</b></font></a></span>
<span class="groupes"><a href="http://yuugure-no-kaigi.forums-gratuits.fr/g5-chasseurs-de-vampire"><font color="#714A4A" size="2"><b>Chasseurs de vampire</b></font></a></span>
<span class="groupes"><a href="http://yuugure-no-kaigi.forums-gratuits.fr/g6-extremistes"><font color="#183152" size="2"><b>Extrémistes</b></font></a></span><br><br><br><br><br>
<span class="gensmall">{TOTAL_POSTS}. {TOTAL_USERS}<br />
{NEWEST_USER}<br><br></span>

{TOTAL_USERS_ONLINE}<br>
{LOGGED_IN_USER_LIST}{TOTAL_CHATTERS_ONLINE}<br></center>
{L_CONNECTED_MEMBERS}
</table></center>
<table class="birthday">
<tr>
<td><img src="http://www.kirikoo.net/images/7Hitomi-20120806-212956.png" /></td>
<td><table>{L_WHOSBIRTHDAY_TODAY}{L_WHOSBIRTHDAY_WEEK}</table>
</td></tr></table>
<!-- END disable_viewonline -->

CSS:

Code:

.statistiques{
background: url("http://www.kirikoo.net/images/7Hitomi-20120808-225827.png") no-repeat center;
height:442px;
}
.statistiques .row1{
text-align:center;
background:none;
}
.groupes{
background-color:#ffffff;
height:40px;
padding:0 15px;
margin:0 8px;
font-size:15px;
font-weight: bold;
font-family: Georgia;
font-style: Italic;
text-align:center;
border: 2px dotted #696969;
}       
.groupes a{
text-decoration: none;
}       
.birthday{
width:600px;
margin:auto;
}       
.birthday .row1{
background:none;
}

[Totomi]

Cette fois si une partie des informations du qui est en ligne a pris une couleur blanche et les membres connecté au cours des 24h n'ont plus le fond marron mais sont légèrement en dessous de l'image.

[Anzu]

Prenez ce template:

Code:

    {JAVASCRIPT}
    <!-- BEGIN message_admin_index -->
    <table id="msg_et" width="100%" border="0" cellspacing="1" cellpadding="0">
      <!-- BEGIN message_admin_titre -->
      <tr>
          <td class="catHead" height="28"><span class="cattitle">{message_admin_index.message_admin_titre.MES_TITRE}</span></td>
      </tr>
      <!-- END message_admin_titre -->
      <!-- BEGIN message_admin_txt -->
      <tr>
          <td rowspan="3" align="center" valign="middle">
          <div class="gensmall">{message_admin_index.message_admin_txt.MES_TXT}</div>
          </td>
      </tr>
      <!-- END message_admin_txt -->
    </table>
    <!-- END message_admin_index -->

    <!-- BEGIN switch_user_login_form_header -->
    <form action="{S_LOGIN_ACTION}" method="post" name="form_login">
      <!-- BEGIN switch_fb_connect_no -->
      <table width="100%" border="0" cellspacing="0" cellpadding="0" class="user_login_form forumline">
          <tr>
            <td class="row1" align="center">
                <table border="0" cellspacing="0" cellpadding="0">
                  <tr>
                      <td><span class="genmed">{L_USERNAME}:</span> </td>
                      <td><input class="post" type="text" size="10" name="username"/> </td>
                      <td>
                        <input class="radio" type="checkbox" name="autologin" {AUTOLOGIN_CHECKED} />
                        <span class="gensmall">{L_AUTO_LOGIN}</span>
                      </td>
                  </tr>

                  <tr>
                      <td><span class="genmed">{L_PASSWORD}:</span> </td>
                      <td><input class="post" type="password" size="10" name="password"/> </td>
                      <td>{S_HIDDEN_FIELDS}<input class="mainoption" type="submit" name="login" value="{L_LOGIN}" /></td>
                  </tr>
                </table>
            </td>
          </tr>
      </table>
      <!-- END switch_fb_connect_no -->

      <!-- BEGIN switch_fb_connect -->
      <table width="100%" border="0" cellspacing="0" cellpadding="0" class="user_login_form forumline">
          <tr>
            <td valign="top" width="100%" class="row1" align="center">
                <table width="100%">
                  <tr>
                      <td width="55%" valign="middle" align="right">
                        <table class="right">
                            <tr>
                              <td><span class="genmed">{L_USERNAME}:</span> </td>
                              <td><input class="post" type="text" size="10" name="username"/> </td>
                              <td>
                                  <input class="radio" type="checkbox" name="autologin" {AUTOLOGIN_CHECKED} />
                                  <span class="gensmall">{L_AUTO_LOGIN}</span>
                              </td>
                            </tr>

                            <tr>
                              <td><span class="genmed">{L_PASSWORD}:</span> </td>
                              <td><input class="post" type="password" size="10" name="password"/> </td>
                              <td>{S_HIDDEN_FIELDS}<input class="mainoption" type="submit" name="login" value="{L_LOGIN}" /></td>
                            </tr>
                        </table>
                      </td>
                      <td width="10%" align="center" valign="middle">
                        <span class="genmed fb_or">{switch_user_login_form_header.switch_fb_connect.L_OR}</span>
                      </td>
                      <td width="35%" class="align_gauche"><fb:login-button size="large" onlogin="window.location='/facebook_connect.forum'" v="2" scope="{switch_user_login_form_header.switch_fb_connect.L_FB_PERMISSIONS}">{switch_user_login_form_header.switch_fb_connect.L_FB_LOGIN_BUTTON}</fb:login-button></td>
                  </tr>
                </table>
            </td>
          </tr>
      </table>
      <!-- END switch_fb_connect -->
    </form>
    <!-- END switch_user_login_form_header -->

    {CHATBOX_TOP}
    {BOARD_INDEX}
    <table width="100%" border="0" cellspacing="0" cellpadding="0">
      <tr>
          <td width="50%" valign="top">
            <!-- BEGIN switch_user_logged_in -->
            <span class="gensmall"><a href="{U_MARK_READ}" class="gensmall">{L_MARK_FORUMS_READ}</a>
            <!-- END switch_user_logged_in -->
            <!-- BEGIN switch_delete_cookies -->
            <br /><a href="{switch_delete_cookies.U_DELETE_COOKIES}" class="gensmall">{switch_delete_cookies.L_DELETE_COOKIES}</a>
            <!-- END switch_delete_cookies -->
            </span>
          </td>
          <td width="50%" align="right">
            <span class="gensmall">
                <a href="{U_TODAY_ACTIVE}" class="gensmall">{L_TODAY_ACTIVE}</a><br />
                <a href="{U_TODAY_POSTERS}" class="gensmall">{L_TODAY_POSTERS}</a><br />
                <a href="{U_OVERALL_POSTERS}" class="gensmall">{L_OVERALL_POSTERS}</a>
                <!-- BEGIN switch_on_index -->
                  <!-- BEGIN switch_delete_cookies -->
                  <br /><a href="{switch_on_index.switch_delete_cookies.U_DELETE_COOKIES}" class="gensmall">{switch_on_index.switch_delete_cookies.L_DELETE_COOKIES}</a>
                  <!-- END switch_delete_cookies -->
                <!-- END switch_on_index -->
            </span>
          </td>
      </tr>
    </table>

    <!-- BEGIN switch_user_login_form_footer -->
    <form action="{S_LOGIN_ACTION}" method="post" name="form_login">
      <!-- BEGIN switch_fb_connect_no -->
      <table width="100%" border="0" cellspacing="0" cellpadding="0" class="user_login_form forumline">
          <tr>
            <td class="row1" align="center">
                <table border="0" cellspacing="0" cellpadding="0">
                  <tr>
                      <td><span class="genmed">{L_USERNAME}:</span> </td>
                      <td><input class="post" type="text" size="10" name="username"/> </td>
                      <td>
                        <input class="radio" type="checkbox" name="autologin" {AUTOLOGIN_CHECKED} />
                        <span class="gensmall">{L_AUTO_LOGIN}</span>
                      </td>
                  </tr>

                  <tr>
                      <td><span class="genmed">{L_PASSWORD}:</span> </td>
                      <td><input class="post" type="password" size="10" name="password"/> </td>
                      <td>{S_HIDDEN_FIELDS}<input class="mainoption" type="submit" name="login" value="{L_LOGIN}" /></td>
                  </tr>
                </table>
            </td>
          </tr>
      </table>
      <!-- END switch_fb_connect_no -->

      <!-- BEGIN switch_fb_connect -->
      <table width="100%" border="0" cellspacing="0" cellpadding="0" class="user_login_form forumline">
          <tr>
            <td valign="top" width="100%" class="row1" align="center">
                <table width="100%">
                  <tr>
                      <td width="55%" valign="middle">
                        <table class="right">
                            <tr>
                              <td><span class="genmed">{L_USERNAME}:</span> </td>
                              <td><input class="post" type="text" size="10" name="username"/> </td>
                              <td>
                                  <input class="radio" type="checkbox" name="autologin" {AUTOLOGIN_CHECKED} />
                                  <span class="gensmall">{L_AUTO_LOGIN}</span>
                              </td>
                            </tr>

                            <tr>
                              <td><span class="genmed">{L_PASSWORD}:</span> </td>
                              <td><input class="post" type="password" size="10" name="password"/> </td>
                              <td>{S_HIDDEN_FIELDS}<input class="mainoption" type="submit" name="login" value="{L_LOGIN}" /></td>
                            </tr>
                        </table>
                      </td>
                      <td width="10%" align="center" valign="middle">
                        <span class="genmed fb_or">{switch_user_login_form_footer.switch_fb_connect.L_OR}</span>
                      </td>
                      <td width="35%" class="align_gauche"><fb:login-button size="large" onlogin="window.location='/facebook_connect.forum'" v="2" scope="{switch_user_login_form_footer.switch_fb_connect.L_FB_PERMISSIONS}">{switch_user_login_form_footer.switch_fb_connect.L_FB_LOGIN_BUTTON}</fb:login-button></td>
                  </tr>
                </table>
            </td>
          </tr>
      </table>
      <!-- END switch_fb_connect -->
    </form>
    <!-- END switch_user_login_form_footer -->

                              <!-- BEGIN disable_viewonline --><center><table cellspacing="2" cellpadding="2" width="900" border="0" class="statistiques"> <tr><td width="15%"> </td><td width="50%"><center><span class="groupes"><a href="http://yuugure-no-kaigi.forums-gratuits.fr/g3-vampires"><font color="#DB0B32" size="2"><b>Vampires</b></font></a></span>
    <span class="groupes"><a href="http://yuugure-no-kaigi.forums-gratuits.fr/g4-humains"><font color="#B09F91" size="2"><b>Humains</b></font></a></span>
    <span class="groupes"><a href="http://yuugure-no-kaigi.forums-gratuits.fr/g5-chasseurs-de-vampire"><font color="#714A4A" size="2"><b>Chasseurs de vampire</b></font></a></span>
    <span class="groupes"><a href="http://yuugure-no-kaigi.forums-gratuits.fr/g6-extremistes"><font color="#183152" size="2"><b>Extrémistes</b></font></a></span><br><br><br><br><br>
    <span class="gensmall">{TOTAL_POSTS}. {TOTAL_USERS}<br />
    {NEWEST_USER}<br><br>
    {TOTAL_USERS_ONLINE}<br>
    {LOGGED_IN_USER_LIST}{TOTAL_CHATTERS_ONLINE}<br><table>{L_CONNECTED_MEMBERS}</table>
    </span></center><br>
    </tr>
    </table>
      <table cellspacing="0" cellpadding="0" width="400" border="0"> <tr><td><img src="http://www.kirikoo.net/images/7Hitomi-20120806-212956.png"></td><td>
        {L_WHOSBIRTHDAY_TODAY}{L_WHOSBIRTHDAY_WEEK}</tr></table><br></center>
    <!-- END disable_viewonline -->

    {CHATBOX_BOTTOM}
    <br clear="all" />
    <!-- BEGIN switch_legend -->
    <table style="position: fixed; bottom: 50px; left: -10px;z-index:10000;"><tr><td><iframe src="/chatbox/chatbox.forum?page=front&" id="chatboxpop" scrolling="no" style="width: 700px; height: 300px; display: none;" marginwidth="0" marginheight="0" frameborder="0"></iframe></td><td style="vertical-align: bottom;">
    <img src="http://www.kirikoo.net/images/7Hitomi-2-20120807-022120.png" onClick="document.getElementById('chatboxpop') .style.display=(this.src=='http://www.kirikoo.net/images/7Hitomi-2-20120807-022120.png')?'block':'none';
    this.src=(this.src=='http://www.kirikoo.net/images/7Hitomi-2-20120807-022120.png')?'http://www.kirikoo.net/images/7Hitomi-1-20120807-022120.png':'http://www.kirikoo.net/images/7Hitomi-2-20120807-022120.png';"/></td></tr></table>
    <br clear="all" />
    <!-- END switch_legend -->

    {AUTO_DST}

    <!-- BEGIN switch_fb_index_login -->
    <div id="fb-root"></div>
    <script type="text/javascript">
    //<![CDATA[
    FB.init({
      appId: '{switch_fb_index_login.FACEBOOK_APP_ID}',
        status: true,
        cookie: true,
        xfbml: true,
      oauth: true
    });
    //]]>
    </script>
    <!-- END switch_fb_index_login -->

Pour le reste, je n'ai pas compris ce que vous vouliez faire.

Cordialement.

[Totomi]

J'ai tous les éléments sur l'image mais celle-ci n'est pas centrée par rapport au reste du forum.

Pour le reste je voulais en fait faire un cadre spécial pour les anniversaires dans lequel se trouverais donc l'image et le petit message qui va avec . Merci de votre aide

[Scoubifitz]

je crois que j'ai compris ...

tout est décalé à cause de la cellule de gauche que vous avez vidé mais qui prend encore 15% de la place du tableau !

... et vous voulez un cadre autour des anniversaire , c'est ça ?

toujours la même partie à remplacer :

Code:

<!-- BEGIN disable_viewonline -->
<table cellspacing="2" cellpadding="2" width="900" class="statistiques">
<tr>
<td><center><span class="groupes"><a href="http://yuugure-no-kaigi.forums-gratuits.fr/g3-vampires"><font color="#DB0B32" size="2"><b>Vampires</b></font></a></span>
<span class="groupes"><a href="http://yuugure-no-kaigi.forums-gratuits.fr/g4-humains"><font color="#B09F91" size="2"><b>Humains</b></font></a></span>
<span class="groupes"><a href="http://yuugure-no-kaigi.forums-gratuits.fr/g5-chasseurs-de-vampire"><font color="#714A4A" size="2"><b>Chasseurs de vampire</b></font></a></span>
<span class="groupes"><a href="http://yuugure-no-kaigi.forums-gratuits.fr/g6-extremistes"><font color="#183152" size="2"><b>Extrémistes</b></font></a></span><br><br><br><br><br>
<span class="gensmall">{TOTAL_POSTS}. {TOTAL_USERS}<br />
{NEWEST_USER}<br><br></span>

{TOTAL_USERS_ONLINE}<br>
{LOGGED_IN_USER_LIST}{TOTAL_CHATTERS_ONLINE}<br>
<table>{L_CONNECTED_MEMBERS}</table>
</center></td></tr></table>
<table class="birthday">
<tr>
<td><img src="http://www.kirikoo.net/images/7Hitomi-20120806-212956.png" /></td>
<td><table>{L_WHOSBIRTHDAY_TODAY}{L_WHOSBIRTHDAY_WEEK}</table>
</td></tr></table>
<!-- END disable_viewonline -->

et le CSS qui va avec :

Code:

.statistiques{
background: url("http://www.kirikoo.net/images/7Hitomi-20120808-225827.png") no-repeat center;
height:442px;margin:auto;
}
.statistiques .row1{
text-align:center;
background:none;
}
.groupes{
background-color:#ffffff;
height:40px;
padding:0 15px;
margin:0 8px;
font-size:15px;
font-weight: bold;
font-family: Georgia;
font-style: Italic;
text-align:center;
border: 2px dotted #696969;
}       
.groupes a{
text-decoration: none;
}       
.birthday{
width:600px;
margin:auto;
background:gray;
padding:10px;
border-radius:20px;
}       
.birthday .row1{
background:none;
}

[Totomi]

Alors le qui est en ligne n'est toujours pas centré et l'écriture a encore changé de couleur mais en tout cas pour mon cadre anniversaire c'est tout à fait ce que je voulais j'ai plus qu'à légèrement le changer.

[Scoubifitz]

mes essais sont comme ça :


une petite explication de ce qui cloche sur votre QEEL ?

[Totomi]

Sur mon forum test mon qui est en ligne est décalé sur la droite et une partie de l'écriture est blanche.
http://forum-de-test.creerforumgratuit.com/?tt=1

[Scoubifitz]

pour l'écriture en blanc , j'ai fermé trop tôt le span ...

Code:

        <!-- BEGIN disable_viewonline -->
        <table cellspacing="2" cellpadding="2" width="900" class="statistiques">
        <tr>
        <td><center><span class="groupes"><a href="http://yuugure-no-kaigi.forums-gratuits.fr/g3-vampires"><font color="#DB0B32" size="2"><b>Vampires</b></font></a></span>
        <span class="groupes"><a href="http://yuugure-no-kaigi.forums-gratuits.fr/g4-humains"><font color="#B09F91" size="2"><b>Humains</b></font></a></span>
        <span class="groupes"><a href="http://yuugure-no-kaigi.forums-gratuits.fr/g5-chasseurs-de-vampire"><font color="#714A4A" size="2"><b>Chasseurs de vampire</b></font></a></span>
        <span class="groupes"><a href="http://yuugure-no-kaigi.forums-gratuits.fr/g6-extremistes"><font color="#183152" size="2"><b>Extrémistes</b></font></a></span><br><br><br><br><br>
        <span class="gensmall">{TOTAL_POSTS}. {TOTAL_USERS}<br />
        {NEWEST_USER}<br><br>
       
        {TOTAL_USERS_ONLINE}<br>
        {LOGGED_IN_USER_LIST}{TOTAL_CHATTERS_ONLINE}<br></span>
        <table>{L_CONNECTED_MEMBERS}</table>
        </center></td></tr></table>
        <table class="birthday">
        <tr>
        <td><img src="http://www.kirikoo.net/images/7Hitomi-20120806-212956.png" /></td>
        <td><table>{L_WHOSBIRTHDAY_TODAY}{L_WHOSBIRTHDAY_WEEK}</table>
        </td></tr></table>
        <!-- END disable_viewonline -->

pour l'alignement ,il y a une "div" de 750px qui n'est pas refermée dans votre message d'accueil ... ce qui perturbe l'affichage ...

[Totomi]

ça fonctionne merci beaucoup, le seul petit problème comme vous avez pu le voir est la couleur de mon écriture; existe-t-il un code css pour changer la couleur ou pour mettre une ombre mais que sur le qui est en ligne .

[Scoubifitz]

à rajouter au CSS :

Code:

.statistiques .row1,.statistiques span,.birthday .row1 span{color:red;text-shadow:0px 0px 10px white,1px 1px black}

[Totomi]

Merci tout marche parfaitement, je passe le sujet en résolu et encore merci.