Mise en page éléments du QEEL

[whovian]

Bonjour,

je suis en train de personnaliser mon QEEL.

Voilà à quoi il ressemble actuellement:

Spoiler:

Comment vous le remarquez, le background est bien en place, en ce qui concerne la légende j'ai bien mis les titres manuellement, mis la police d'écriture + couleur que je voulais.

Cependant voilà, les éléments sont au milieu comme cela et je ne sais pas comment les placer comme je le souhaite (dans les espaces visibles sur le screen).


J'aimerais que cela ressemble à ça :

Spoiler:

Voici mon CSS: (ce que j'ai modifié pour le QEEL est en haut)

Code:

.qeelgroupes{
font-family: 'Georges';
  text-shadow: #000000 3px 3px 4px;
  text-align:justify;
  LETTER-SPACING: -1px;
  font-size: 25px;
  text-transform : lowercase;
  text-decoration: none !important;
  background-color: transparent !important;
    position: relative;
  width: 236px;
  height: 80px;
  line-height: 15px;
  word-spacing: -0px;}


table#qeel{
  background-image:url('http://img.imagesia.com/fichiers/jk/qeel-design-2_imagesia-com_jkrr.png');
 height: 480px;
 width: 948px;
-o-border-radius: 40px; -webkit-border-radius: 40px; border-radius: 40px;
text-align: center;}


td.row1.over{
    padding-bottom: 15px;
}

.imgcate {
background: url(http://img.imagesia.com/fichiers/jk/desc_imagesia-com_jk8g.png);
width: 584px;
height: 115px;
margin-left: -30px;
margin-top: -15px;
z-index : 2;
}

.descriptionfond {
text-align: justify;
font-family: arial;
padding: 20px;
font-size: 12px;
letter-spacing: -0.4px;
line-height: 14px;
width: 540px;
height: 100px;
}


.messagdernier {
text-align: center;
margin-top: 10px;
margin-right: 5px;
font-face: arial;
color: #191313!important;
font-size: 10px;
line-height: 16px;
width: 135px;
height: 105px;
padding: 10px;
Align: center;
box-shadow: none;
-webkit-box-shadow: none;
background-image: url(http://img.imagesia.com/fichiers/jk/fondcate_imagesia-com_jk6u.png);
z-index: 2;
-webkit-border-radius: 0px;
border-radius: 0px;
}

.arrondi {
-moz-border-radius:300px;
-webkit-border-radius:300px;
border-radius:300px;
}

.code{
  font-family: Courier,'Arial',monospace,sans-serif;
  font-size: 12px; /* Taille du texte */
  color: #808060; /* Couleur de ton texte */
  background-color: #ffffff; /* Couleur du fond */
  border: #ffffff; /* Couleur de la bordure */
  border-style: solid;
  border-left-width: 1px
        border-top-width: 1px;
  border-right-width: 1px;
  border-bottom-width: 1px;
}


#opacite img {
    opacity: 0.5;
    }

#opacite img:hover {
    opacity: 0.9;
    }

a.forumlink {
text-shadow: #000000 1px 1px 1px;
}

.ban1 { background-image: url('http://imageshack.com/a/img812/5646/y4c1.png'); }
.ban2 { background-image: url('http://imageshack.com/a/img41/5340/reir.png'); }
.ban3 { background-image: url('http://imageshack.com/a/img22/7526/cds3.png'); }
 






/*ENLEVER LES BORDURES GENANTES*/
.row3Right
{
border: none !important;
}
.thHead
{
border: none !important;
}
.thCornerL, .thCornerR, .thTop
{
border: none !important;
}
.thLeft, .thRight
{
border-left: none !important;
border-right: none !important;
}
.catLeft, .catRight
{
border: none! important;
}
.catHead
{
border: none !important;
}
.catBottom
{
border: none !important;
}





.postbody a {
  display: inline-block;
  max-width: 300px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.imagebasdroite {
position: fixed;
bottom: 0px;
right: 0px;
z-index: 150;
}

.imagehautdroite {
position: fixed;
top: 0px;
right: 0px;
z-index: 150;
}

.imagebasgauche {
position: fixed;
bottom: 0px;
left: 0px;
z-index: 150;
}

.imagehautgauche {
position: fixed;
top: 0px;
left: 0px;
z-index: 150;
}

.bouhautbas {
    bottom: 70px;
    left: 30px; /* remplacez left par right pour afficher les boutons à droite */
    position: fixed;
    z-index: 100;
}

/*modifier l'apparence des scrollbars de tout le forum*/
::-webkit-scrollbar {
  width: 5px; /*largeur de la scrollbar verticale*/
  height: 5px; /*hauteur de la scrollbar horizontale*/
  background-color: #000000;}

::-webkit-scrollbar-track {
  background-color: #050707; /*couleur du fond de la scrollbar*/}
::-webkit-scrollbar-thumb { /*la petite bande qui monte/descend*/
  background-color: #341f1f /*couleur de l'ascenseur*/;
  border-radius: 0px;
  -moz-border-radius: 0px;
  -webkit-border-radius: 0px;}


#chatbox_header .catBottom .cattitle {
color:light green;
}
#chatbox_header .cattitle strong { display: none; }
#chatbox_header .cattitle:before { content: "Discute avec le monde magique"; }
#chatbox_header .cattitle { background-color:#000000; }
#chatbox_header .cattitle strong { visibility: hidden; }


a:hover{text-decoration: none !important;}
a {text-decoration: none !important;}
a:link {text-decoration: none;}
a:visited {text-decoration: none;}


.postdetails.poster-profile a img {
border-radius:20px;-moz-border-radius:20px;-webkit-border-radius:20px;-o-border-radius:20px;
border-top: 5px solid #00080d;
border-bottom: 5px solid #00080d;
border-left: 5px solid #00080d;
border-right: 5px solid #00080d;
}


.police{
font-family: "La Belle Aurore";
font-size: 20px;
}


-RETRAIT : ce CSS pose de nombreux problèmes - { display: none; }

body
{
background-position: top center;
background-repeat: no-repeat;
background-color: black;
background-attachment: scroll !important;
}

a:hover
{
text-decoration: none !important;
}

#i_logo
{
height: 500px;
}





#page-body
{
margin-top: 20px;
background-color: black;
box-shadow: 0px 0px 5px #000000;
-moz-box-shadow: 0px 0px 5px #000000;
-o-box-shadow: 0px 0px 5px #000000;
-htm-box-shadow: 0px 0px 5px #000000;
-webkit-box-shadow: 0px 0px 5px #000000;
padding-top: 10px;
padding-bottom: 10px;
margin-bottom: 20px;
}

.bodylinewidth
{
width: 980px;
margin: auto;
}

.forumline
{
border-radius:40px;-moz-border-radius:40px;-webkit-border-radius:30px;-o-border-radius:30px;
width: 100%;
margin-left: auto;
margin-right: auto;
background: url(http://img.imagesia.com/fichiers/ji/marron1_imagesia-com_ji7y.png) top left repeat #161718;
margin-top: 5px;
margin-bottom: 30px;
padding-bottom: 5px;
padding-left: 5px;
padding-right: 5px;
padding-top: 20px;
border: none;
box-shadow: 0px 0px 4px #000000;
-moz-box-shadow: 0px 0px 4px #000000;
-o-box-shadow: 0px 0px 4px #000000;
-htm-box-shadow: 0px 0px 4px #000000;
-webkit-box-shadow: 0px 0px 4px #000000;
}

table
{
width: 100%;
margin: auto;
}


.secondarytitle
{
letter-spacing: 2px;
font-family: Bigelow Rules;
font-variant: small-caps;
text-shadow: 1px 1px 0px #000000;
}
h2
{
  font-size: 65px;
  font-weight: regular;
}

a.forumlink
{
display: block;
color:#2d2d3c;
padding-left: 0px;
margin-left: 0px;
font-size: 24px;
font-family: Monotype Corsiva;
text-shadow: 1px 1px 1px #000000;
transform: all;
-moz-transform: all;
-o-transform: all;
-htm-transform: all;
-webkit-transform: all;
transition: 0.5s;
-moz-transition: 0.5s;
-o-transition: 0.5s;
-htm-transition: 0.5s;
-webkit-transition: 0.5s;
}

a.forumlink:hover
{
display: block;
  color:#481919;
font-style: regular;
padding-left: 12px;
transform: all;
-moz-transform: all;
-o-transform: all;
-htm-transform: all;
-webkit-transform: all;
transition: 0.5s;
-moz-transition: 0.5s;
-o-transition: 0.5s;
-htm-transition: 0.5s;
-webkit-transition: 0.5s;
}







#qeel1
{
width: 850px;
margin-left: auto;
margin-right: auto;
height: 500px;
}
.onglet1, .onglet2, .onglet3
{
display: inline-block;
width: 120px;
height: 30px;
margin-left: 20px;
background: #161718;
border-top: 1px solid #1d1f1d;
border-left: 1px solid #1d1f1d;
border-right: 1px solid #1d1f1d;
border-top-left-radius: 10px;
border-top-right-radius: 10px;
-moz-border-radius-topleft: 10px;
-moz-border-radius-topright: 10px;
-webkit-border-top-left-radius: 10px;
-webkit-border-top-right-radius: 10px;
text-align: center;
}
.onglet1:hover, .onglet2:hover, .onglet3:hover
{
background: url(http://img4.hostingpics.net/pics/516061fondonglet.png) top repeat-x #161718;
}
.onglet1 a, .onglet2 a, .onglet3 a
{
display: block;
padding-top: 6px;
font-weight: bold;
text-decoration: none !important;
}
.onglet1 a:hover, .onglet2 a:hover, .onglet3 a:hover
{
color: #d7c99c !important;
text-shadow: 1px 1px 0px #282223;
}
.contenu
{
display: block;
height: 300px;
background: url(http://img4.hostingpics.net/pics/518598qeelfond4.jpg) center no-repeat #161718;
border: 1px solid #1d1f1d;
box-shadow: 0px 0px 4px #000000;
-moz-box-shadow: 0px 0px 4px #000000;
-o-box-shadow: 0px 0px 4px #000000;
-htm-box-shadow: 0px 0px 4px #000000;
-webkit-box-shadow: 0px 0px 4px #000000;
}
#contenu1, #contenu2, #contenu3
{
display: none;
}
#qeel1:target #contenu1
{
display: block;
height: 300px;
overflow: hidden;
background: url(http://img4.hostingpics.net/pics/176231qeelfond1.jpg) center no-repeat #161718;
border: 1px solid #1d1f1d;
box-shadow: 0px 0px 4px #000000;
-moz-box-shadow: 0px 0px 4px #000000;
-o-box-shadow: 0px 0px 4px #000000;
-htm-box-shadow: 0px 0px 4px #000000;
-webkit-box-shadow: 0px 0px 4px #000000;
font-size: 11px;
}
#qeel2:target #contenu2
{
display: block;
height: 300px;
overflow: hidden;
background: url(http://img11.hostingpics.net/pics/882912qeelfond5.jpg) center no-repeat #161718;
border: 1px solid #1d1f1d;
box-shadow: 0px 0px 4px #000000;
-moz-box-shadow: 0px 0px 4px #000000;
-o-box-shadow: 0px 0px 4px #000000;
-htm-box-shadow: 0px 0px 4px #000000;
-webkit-box-shadow: 0px 0px 4px #000000;
font-size: 11px;
}
#qeel3:target #contenu3
{
display: block;
height: 300px;
overflow: hidden;
background: url(http://img4.hostingpics.net/pics/337749qeelfond3.jpg) center no-repeat #161718;
border: 1px solid #1d1f1d;
box-shadow: 0px 0px 4px #000000;
-moz-box-shadow: 0px 0px 4px #000000;
-o-box-shadow: 0px 0px 4px #000000;
-htm-box-shadow: 0px 0px 4px #000000;
-webkit-box-shadow: 0px 0px 4px #000000;
font-size: 11px;
}
.qeel_content
{
width: 400px;
height: 260px;
overflow: auto;
margin: 10px;
padding: 6px;
font-size: 11px;
background: #0e0f11;
border-top: 5px solid #28282a;
border-bottom: 5px solid #28282a;
border-left: 1px solid #28282a;
border-right: 1px solid #28282a;
box-shadow: 0px 0px 5px #000000;
-moz-box-shadow: 0px 0px 5px #000000;
-o-box-shadow: 0px 0px 5px #000000;
-htm-box-shadow: 0px 0px 5px #000000;
-webkit-box-shadow: 0px 0px 5px #000000;
}
.qeel_content a
{
text-decoration: none !important;
}






.row3Right
{
border: none !important;
}
.thHead
{
border: none !important;
}
.thCornerL, .thCornerR, .thTop
{
border: none !important;
}
.thLeft, .thRight
{
border-left: none !important;
border-right: none !important;
}
.catLeft, .catRight
{
border: none! important;
}
.catHead
{
border: none !important;
}
.catBottom
{
border: none !important;
}






Et mon template index_body:

Code:

{JAVASCRIPT}
<!-- BEGIN message_admin_index -->
<table class="forumline" 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 class="row1" 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>&nbsp;</td>
                  <td><input class="post" type="text" size="10" name="username"/>&nbsp;</td>
                  <td>
                     <input class="radio" type="checkbox" name="autologin" {AUTOLOGIN_CHECKED} />
                     <span class="gensmall">{L_AUTO_LOGIN}</span>&nbsp;
                  </td>
               </tr>

               <tr>
                  <td><span class="genmed">{L_PASSWORD}:</span>&nbsp;</td>
                  <td><input class="post" type="password" size="10" name="password"/>&nbsp;</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>&nbsp;</td>
                           <td><input class="post" type="text" size="10" name="username"/>&nbsp;</td>
                           <td>
                              <input class="radio" type="checkbox" name="autologin" {AUTOLOGIN_CHECKED} />
                              <span class="gensmall">{L_AUTO_LOGIN}</span>&nbsp;
                           </td>
                        </tr>

                        <tr>
                           <td><span class="genmed">{L_PASSWORD}:</span>&nbsp;</td>
                           <td><input class="post" type="password" size="10" name="password"/>&nbsp;</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 -->
<br>


  
 <center><iframe style="border:none" src="http://files.podsnack.com/iframe/embed.html?hash=a19fgis8&t=1400184576" width="200" height="27" allowfullscreen="true" mozallowfullscreen="true" webkitallowfullscreen="true"></iframe></center>
  <br>
  
  
  
    
{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></span>
         <!-- END switch_user_logged_in -->
         <!-- BEGIN switch_delete_cookies -->
         <br /><span class="gensmall"><a href="{switch_delete_cookies.U_DELETE_COOKIES}" class="gensmall">{switch_delete_cookies.L_DELETE_COOKIES}</a></span>
         <!-- END switch_delete_cookies -->
      </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>&nbsp;</td>
                  <td><input class="post" type="text" size="10" name="username"/>&nbsp;</td>
                  <td>
                     <input class="radio" type="checkbox" name="autologin" {AUTOLOGIN_CHECKED} />
                     <span class="gensmall">{L_AUTO_LOGIN}</span>&nbsp;
                  </td>
               </tr>

               <tr>
                  <td><span class="genmed">{L_PASSWORD}:</span>&nbsp;</td>
                  <td><input class="post" type="password" size="10" name="password"/>&nbsp;</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>&nbsp;</td>
                           <td><input class="post" type="text" size="10" name="username"/>&nbsp;</td>
                           <td>
                              <input class="radio" type="checkbox" name="autologin" {AUTOLOGIN_CHECKED} />
                              <span class="gensmall">{L_AUTO_LOGIN}</span>&nbsp;
                           </td>
                        </tr>

                        <tr>
                           <td><span class="genmed">{L_PASSWORD}:</span>&nbsp;</td>
                           <td><input class="post" type="password" size="10" name="password"/>&nbsp;</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 -->
<table class="forumline" width="100%" border="0" cellspacing="1" cellpadding="0" id="qeel">
   <tr>
      <td class="catHead" colspan="2" height="28">
      <!-- BEGIN switch_viewonline_nolink -->
      <span class="cattitle">{L_WHO_IS_ONLINE}</span>
      <!-- END switch_viewonline_nolink -->
      </td>
   </tr>
   <tr>
      
      <td class="row1" width="100%"><span class="gensmall"><span id="bert">{TOTAL_POSTS}<script type="text/javascript">document.getElementById('bert').innerHTML=document.getElementById('bert').innerHTML.replace(/Nos membres ont posté un total de/,"Secoué par les événements, le Royaume-Uni se montre affaibli. Pourtant, malgré la lutte que se mènent entre les bons et les mauvais, les sorciers continuent de vivre leur vie, ainsi ils ont rédigé un total de ");</script><script type="text/javascript">document.getElementById('bert').innerHTML=document.getElementById('bert').innerHTML.replace(/messages/,"parchemins.");</script></span><br />
      <span id="matt">{TOTAL_USERS}</span><script type="text/javascript">document.getElementById('matt').innerHTML=document.getElementById('matt').innerHTML.replace(/membres enregistrés/,"sorciers dans le monde magique.");</script><br />
      <span id="yosh">{NEWEST_USER}</span><script type="text/javascript">document.getElementById('yosh').innerHTML=document.getElementById('yosh').innerHTML.replace(/L'utilisateur enregistré le plus récent est/,"Le dernier arrivant est");</script> </span></span></td>
   </tr>
   <tr>
      <td class="row1"><span class="gensmall">  <span id="totaluser">{TOTAL_USERS_ONLINE}</span>
<script type="text/javascript">
document.getElementById('totaluser').innerHTML=document.getElementById('totaluser').innerHTML.replace(/utilisateur en ligne/,"personne se promenant dans le monde magique");
document.getElementById('totaluser').innerHTML=document.getElementById('totaluser').innerHTML.replace(/utilisateurs en ligne/,"personnes se promenant dans le monde magique");            
document.getElementById('totaluser').innerHTML=document.getElementById('totaluser').innerHTML.replace(/Enregistré/,"sorcier");
document.getElementById('totaluser').innerHTML=document.getElementById('totaluser').innerHTML.replace(/Enregistrés/,"sorciers");
document.getElementById('totaluser').innerHTML=document.getElementById('totaluser').innerHTML.replace(/Invisible/,"fantôme");
document.getElementById('totaluser').innerHTML=document.getElementById('totaluser').innerHTML.replace(/Invisibles/,"fantômes");
document.getElementById('totaluser').innerHTML=document.getElementById('totaluser').innerHTML.replace(/Invité/,"moldu.");
document.getElementById('totaluser').innerHTML=document.getElementById('totaluser').innerHTML.replace(/Invités/,"moldus.");
</script><br>

                    <span id="record">{RECORD_USERS}</span><br>
<script type="text/javascript">
document.getElementById('record').innerHTML=document.getElementById('record').innerHTML.replace(/Le record du nombre d'utilisateurs en ligne est de/,"Le record du nombre de sorciers fut");
</script><br>                

                   <!-- MEMBRES ACTUELLEMENT CONNECTES -->
    <span id="connecteduser">{LOGGED_IN_USER_LIST}</span>
    <script type="text/javascript">
    document.getElementById('connecteduser').innerHTML=document.getElementById('connecteduser').innerHTML.replace(/Utilisateurs enregistrés/,"Sorciers réveillés");
    </script>
                  
   </tr>
   {L_CONNECTED_MEMBERS}
   <tr>
          <td class="row1"><span class="qeelgroupes"><a href="http://hogwartstravellers.forumactif.org/g3-gryffondor"><font color="#78291f">Gryffondor</font></a> <a href="http://hogwartstravellers.forumactif.org/g4-serdaigle"><font color="#1f3752">Serdaigle</font></a> <a href="http://hogwartstravellers.forumactif.org/g5-serpentard"><font color="#23613c">Serpentard</font></a> <a href="http://hogwartstravellers.forumactif.org/g6-poufsouffle"><font color="#b1b369">Poufsouffle</font></a> </span></td>
   </tr>
   
</table>
<!-- END disable_viewonline -->
{CHATBOX_BOTTOM}
                  
                  
     <table style="position: fixed; bottom: 200px; left: 0px;background-color: none;z-index:10000;"><tr><td><iframe src="/chatbox/chatbox.forum?page=front&" id="chatboxpop" scrolling="no"style="width: 600px; height: 400px; display: none;" marginwidth="0" marginheight="0"frameborder="0"></iframe></td><td style="vertical-align: bottom;"><imgsrc="http://i46.servimg.com/u/f46/13/86/20/02/hroyp810.png"onClick="document.getElementById('chatboxpop').style.display=(this.src=='http://i46.servimg.com/u/f46/13/86/20/02/hroyp810.png')?'block':'none';this.src=(this.src=='http://i46.servimg.com/u/f46/13/86/20/02/hroyp810.png')?'http://i46.servimg.com/u/f46/13/86/20/02/fgbt8f10.png':'http://i46.servimg.com/u/f46/13/86/20/02/hroyp810.png';"/></td></tr></table>            
                  
                  
                  
<br clear="all" />
<!-- BEGIN switch_legend -->
<table border="0" cellspacing="3" cellpadding="0" align="center">
   <tr>
      <td align="center" width="20"><img src="{FORUM_NEW_IMG}" alt="{L_NEW_POSTS}" /></td>
      <td><span class="gensmall">{L_NEW_POSTS}</span></td>
      <td></td>
      <td align="center" width="20"><img src="{FORUM_IMG}" alt="{L_NO_NEW_POSTS}" /></td>
      <td><span class="gensmall">{L_NO_NEW_POSTS}</span></td>
      <td>&nbsp;&nbsp;</td>
      <td align="center" width="20"><img src="{FORUM_LOCKED_IMG}" alt="{L_FORUM_LOCKED}" /></td>
      <td><span class="gensmall">{L_FORUM_LOCKED}</span></td>
   </tr>
</table>
<!-- 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 -->
                  

                  
                  
                

Mon forum est celui de mon profil.


Est-ce que quelqu'un saurait-il le faire et pourrait m'aider s'il vous plait?
merci d'avance,
bonne fin de semaine!

[whovian]

up! s'il vous plait.

[Lixyr]

Bonjour, Afin de conserver un forum lisible, l'utilisation des mises en forme suivante est interdite : Le gras et la couleur (réservés au staff de ce forum), L'écriture en SMS (abréviations) Pour plus de détails sur la conduite à tenir sur ce forum, merci de lire la Charte du forum. A bientôt sur ForumActif

Bonjour, Je vous rappelle qu'il est autorisé un seul UP par tranche de 24 heures, à partir de votre dernier message posté dans le sujet concerné. Je vous invite à lire : - Règles générales du forum - Charte de ce forum A bientôt sur ForumActif

Bonjour,

Au niveau de la mise en page il faudrait en fait supprimer les cellules, qu'on ne peut pas bouger comme on veut, et mettre des blocs ce sera plus simple.

Donc au niveau du template, ça donne ça :

Code:

{JAVASCRIPT}
<!-- BEGIN message_admin_index -->
<table class="forumline" 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 class="row1" 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>&nbsp;</td>
                <td><input class="post" type="text" size="10" name="username"/>&nbsp;</td>
                <td>
                  <input class="radio" type="checkbox" name="autologin" {AUTOLOGIN_CHECKED} />
                  <span class="gensmall">{L_AUTO_LOGIN}</span>&nbsp;
                </td>
            </tr>
 
            <tr>
                <td><span class="genmed">{L_PASSWORD}:</span>&nbsp;</td>
                <td><input class="post" type="password" size="10" name="password"/>&nbsp;</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>&nbsp;</td>
                  <td><input class="post" type="text" size="10" name="username"/>&nbsp;</td>
                  <td>
                    <input class="radio" type="checkbox" name="autologin" {AUTOLOGIN_CHECKED} />
                    <span class="gensmall">{L_AUTO_LOGIN}</span>&nbsp;
                  </td>
                </tr>
                <tr>
                  <td><span class="genmed">{L_PASSWORD}:</span>&nbsp;</td>
                  <td><input class="post" type="password" size="10" name="password"/>&nbsp;</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 -->
<br />
<center>
  <iframe style="border:none" src="http://files.podsnack.com/iframe/embed.html?hash=a19fgis8&t=1400184576" width="200" height="27" allowfullscreen="true" mozallowfullscreen="true" webkitallowfullscreen="true"></iframe>
</center>
<br />

{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></span>
        <!-- END switch_user_logged_in -->
        <!-- BEGIN switch_delete_cookies -->
        <br /><span class="gensmall"><a href="{switch_delete_cookies.U_DELETE_COOKIES}" class="gensmall">{switch_delete_cookies.L_DELETE_COOKIES}</a></span>
        <!-- END switch_delete_cookies -->
      </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>&nbsp;</td>
                  <td><input class="post" type="text" size="10" name="username"/>&nbsp;</td>
                  <td>
                    <input class="radio" type="checkbox" name="autologin" {AUTOLOGIN_CHECKED} />
                    <span class="gensmall">{L_AUTO_LOGIN}</span>&nbsp;
                  </td>
              </tr>

              <tr>
                  <td><span class="genmed">{L_PASSWORD}:</span>&nbsp;</td>
                  <td><input class="post" type="password" size="10" name="password"/>&nbsp;</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>&nbsp;</td>
                          <td><input class="post" type="text" size="10" name="username"/>&nbsp;</td>
                          <td>
                              <input class="radio" type="checkbox" name="autologin" {AUTOLOGIN_CHECKED} />
                              <span class="gensmall">{L_AUTO_LOGIN}</span>&nbsp;
                          </td>
                        </tr>

                        <tr>
                          <td><span class="genmed">{L_PASSWORD}:</span>&nbsp;</td>
                          <td><input class="post" type="password" size="10" name="password"/>&nbsp;</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 -->
<table class="forumline" width="100%" border="0" cellspacing="1" cellpadding="0" id="qeel">
  <tr>
    <td class="row1" width="100%">
     
        <div class="bloc_g">
          <span class="gensmall">
            <span id="bert">{TOTAL_POSTS}
              <script type="text/javascript">document.getElementById('bert').innerHTML=document.getElementById('bert').innerHTML.replace(/Nos membres ont posté un total de/,"Secoué par les événements, le Royaume-Uni se montre affaibli. Pourtant, malgré la lutte que se mènent entre les bons et les mauvais, les sorciers continuent de vivre leur vie, ainsi ils ont rédigé un total de ");</script>
              <script type="text/javascript">document.getElementById('bert').innerHTML=document.getElementById('bert').innerHTML.replace(/messages/,"parchemins.");</script>
            </span>
            <br />
            <span id="matt">{TOTAL_USERS}</span>
            <script type="text/javascript">document.getElementById('matt').innerHTML=document.getElementById('matt').innerHTML.replace(/membres enregistrés/,"sorciers dans le monde magique.");</script>
            <br />
            <span id="yosh">{NEWEST_USER}
              <script type="text/javascript">document.getElementById('yosh').innerHTML=document.getElementById('yosh').innerHTML.replace(/L'utilisateur enregistré le plus récent est/,"Le dernier arrivant est");</script>
            </span>
          </span>
          <span class="gensmall">
            <span id="totaluser">{TOTAL_USERS_ONLINE}
              <script type="text/javascript">
              document.getElementById('totaluser').innerHTML=document.getElementById('totaluser').innerHTML.replace(/utilisateur en ligne/,"personne se promenant dans le monde magique");
              document.getElementById('totaluser').innerHTML=document.getElementById('totaluser').innerHTML.replace(/utilisateurs en ligne/,"personnes se promenant dans le monde magique");         
              document.getElementById('totaluser').innerHTML=document.getElementById('totaluser').innerHTML.replace(/Enregistré/,"sorcier");
              document.getElementById('totaluser').innerHTML=document.getElementById('totaluser').innerHTML.replace(/Enregistrés/,"sorciers");
              document.getElementById('totaluser').innerHTML=document.getElementById('totaluser').innerHTML.replace(/Invisible/,"fantôme");
              document.getElementById('totaluser').innerHTML=document.getElementById('totaluser').innerHTML.replace(/Invisibles/,"fantômes");
              document.getElementById('totaluser').innerHTML=document.getElementById('totaluser').innerHTML.replace(/Invité/,"moldu.");
              document.getElementById('totaluser').innerHTML=document.getElementById('totaluser').innerHTML.replace(/Invités/,"moldus.");
              </script><br />
            </span>
            <span id="record">{RECORD_USERS}
              <script type="text/javascript">
                document.getElementById('record').innerHTML=document.getElementById('record').innerHTML.replace(/Le record du nombre d'utilisateurs en ligne est de/,"Le record du nombre de sorciers fut");
              </script>
            </span><br />
          </span>
        </div>
     
      <div class="bloc_b">
          <span class="qeelgroupes">
            <a href="http://hogwartstravellers.forumactif.org/g3-gryffondor"><font color="#78291f">Gryffondor</font></a> <a href="http://hogwartstravellers.forumactif.org/g4-serdaigle"><font color="#1f3752">Serdaigle</font></a> <a href="http://hogwartstravellers.forumactif.org/g5-serpentard"><font color="#23613c">Serpentard</font></a> <a href="http://hogwartstravellers.forumactif.org/g6-poufsouffle"><font color="#b1b369">Poufsouffle</font></a>
          </span>
        </div>
     
        <div class="bloc_d">
          <!-- MEMBRES ACTUELLEMENT CONNECTES -->
          <span id="connecteduser">{LOGGED_IN_USER_LIST}
            <script type="text/javascript">
              document.getElementById('connecteduser').innerHTML=document.getElementById('connecteduser').innerHTML.replace(/Utilisateurs enregistrés/,"Sorciers réveillés");
            </script>
          </span>
          <table id="connected_members">{L_CONNECTED_MEMBERS}</table>
        </div>
      <hr style="clear: both;visibility: hidden;" />
       
    </td>
  </tr>
</table>
<!-- END disable_viewonline -->
{CHATBOX_BOTTOM}
               
                   
        <table style="position: fixed; bottom: 200px; left: 0px;background-color: none;z-index:10000;"><tr><td><iframe src="/chatbox/chatbox.forum?page=front&" id="chatboxpop" scrolling="no"style="width: 600px; height: 400px; display: none;" marginwidth="0" marginheight="0"frameborder="0"></iframe></td><td style="vertical-align: bottom;"><imgsrc="http://i46.servimg.com/u/f46/13/86/20/02/hroyp810.png"onClick="document.getElementById('chatboxpop').style.display=(this.src=='http://i46.servimg.com/u/f46/13/86/20/02/hroyp810.png')?'block':'none';this.src=(this.src=='http://i46.servimg.com/u/f46/13/86/20/02/hroyp810.png')?'http://i46.servimg.com/u/f46/13/86/20/02/fgbt8f10.png':'http://i46.servimg.com/u/f46/13/86/20/02/hroyp810.png';"/></td></tr></table>         
                   
                   
                   
    <br clear="all" />
    <!-- BEGIN switch_legend -->
    <table border="0" cellspacing="3" cellpadding="0" align="center">
      <tr>
          <td align="center" width="20"><img src="{FORUM_NEW_IMG}" alt="{L_NEW_POSTS}" /></td>
          <td><span class="gensmall">{L_NEW_POSTS}</span></td>
          <td></td>
          <td align="center" width="20"><img src="{FORUM_IMG}" alt="{L_NO_NEW_POSTS}" /></td>
          <td><span class="gensmall">{L_NO_NEW_POSTS}</span></td>
          <td>&nbsp;&nbsp;</td>
          <td align="center" width="20"><img src="{FORUM_LOCKED_IMG}" alt="{L_FORUM_LOCKED}" /></td>
          <td><span class="gensmall">{L_FORUM_LOCKED}</span></td>
      </tr>
    </table>
    <!-- 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 -->

et au niveau du CSS, il faudrait que vous rajoutiez ça :

Code:

.bloc_g {
float: left;
position: relative;
top: 36px;
color: #FFF !important;
width: 442px;
left: 52px;
height: 108px;
}
.bloc_d {
color: #FFF;
float: left;
position: relative;
left: 146px;
top: -61px;
width: 275px;
height: 201px;
}
.bloc_b {
color: #FFF;
float: left;
width: 285px;
position: relative;
top: 200px;
left: -314px;
height: 98px;
}

span#connecteduser {font-size:12px;}


Ensuite pour la mise en page, ça risque d'être un peu étrange, vu qu'on a pas le même affichage, d'ailleurs votre CSS déforme tout chez moi... Enfin, on verra bien.

[whovian]

Parfait! Merci!