Katie
{ Membre }
Messages : 10
| J'avais déjà exposé mon souci a la suite d'un tuto, mais j'ai pensé que ce n'était pas la bonne place pour régler le souci... Donc je le déplace ici. # L'adresse de votre forum. --- http://essai-its.frenchboard.com/index.htm # Le navigateur utilisé. --- Firefox # La version du forum. --- phpBB2 # Le problème. --- J'ai un décalage qui se produit lorsque j'ajoute des messages ou des des sujets. J'ai suivi a la lettre ce tuto : https://css-actif.forumactif.org/structures-des-forums-f31/supprimer-la-colonne-derniers-messages-t4655.htm#40398# Ce que j'aimerais. --- Que "Messages/Sujets" + le cadre du dernier message restent fixes... # Mon Template Index_box. - Code:
-
<table width="100%" border="0" cellspacing="1" cellpadding="0" align="center"> <tr> <td valign="bottom"> <!-- BEGIN switch_user_logged_in --> <span class="gensmall">{LAST_VISIT_DATE}
{CURRENT_TIME}
</span> <!-- END switch_user_logged_in --> <div class="nav"><a class="nav" href="{U_INDEX}">{L_INDEX}</a>{NAV_CAT_DESC}</div> </td> <td class="gensmall" align="right" valign="bottom"> <!-- BEGIN switch_user_logged_in --> <a class="gensmall" href="{U_SEARCH_NEW}">{L_SEARCH_NEW}</a>
<a class="gensmall" href="{U_SEARCH_SELF}">{L_SEARCH_SELF}</a>
<!-- END switch_user_logged_in --> <a class="gensmall" href="{U_SEARCH_UNANSWERED}">{L_SEARCH_UNANSWERED}</a> </td> </tr> </table> <!-- BEGIN catrow --><!-- BEGIN tablehead --><table class="forumline" width="100%" border="0" cellspacing="1" cellpadding="0"> <tr> <th colspan="{catrow.tablehead.INC_SPAN}" nowrap="nowrap" width="100%" class="secondarytitle"> {catrow.tablehead.L_FORUM} </th>
</tr> <!-- END tablehead --> <!-- BEGIN cathead --> <tr> <!-- BEGIN inc --> <td class="{catrow.cathead.inc.INC_CLASS}" width="46"><img src="{SPACER}" height="0" width="46" /></td> <!-- END inc --> <td class="{catrow.cathead.CLASS_CAT}" colspan="{catrow.cathead.INC_SPAN}" width="100%"> <h{catrow.cathead.LEVEL} class="hierarchy"> <span class="cattitle"> <a class="cattitle" title="{catrow.cathead.CAT_DESC}" href="{catrow.cathead.U_VIEWCAT}">{catrow.cathead.CAT_TITLE}</a> </span> </h{catrow.cathead.LEVEL}> </td> <td class="{catrow.cathead.CLASS_ROWPIC}" colspan="3" align="right"> </td> </tr> <!-- END cathead --> <!-- BEGIN forumrow --> <tr> <!-- BEGIN inc --> <td class="{catrow.forumrow.inc.INC_CLASS}" width="46"><img src="{SPACER}" height="0" width="46" alt="." /></td> <!-- END inc --> <td class="{catrow.forumrow.INC_CLASS}" align="center" valign="middle"> <img title="{catrow.forumrow.L_FORUM_FOLDER_ALT}" src="{catrow.forumrow.FORUM_FOLDER_IMG}" alt="{catrow.forumrow.L_FORUM_FOLDER_ALT}" /> </td> <td class="row1 over" colspan="{catrow.forumrow.INC_SPAN}" valign="top" width="100%" height="50"> <h{catrow.forumrow.LEVEL} class="hierarchy"> <span class="forumlink"> <a class="forumlink" href="{catrow.forumrow.U_VIEWFORUM}">{catrow.forumrow.FORUM_NAME}</a>
</span> </h{catrow.forumrow.LEVEL}> <table> <tr> <td width="83%"><span class="genmed">{catrow.forumrow.FORUM_DESC}</span> <span class="gensmall"> <!-- BEGIN switch_moderators_links --> {catrow.forumrow.switch_moderators_links.L_MODERATOR}{catrow.forumrow.switch_moderators_links.MODERATORS} <!-- END switch_moderators_links --> {catrow.forumrow.L_LINKS}{catrow.forumrow.LINKS} </td> <td width="20%" class="row3 over" align="center" valign="middle" height="50"> <span class="gensmall"> <div class="sujets_messages">Messages : {catrow.forumrow.POSTS} | Sujets : {catrow.forumrow.TOPICS}</div> <div class="messages_sujets_derniers_sujets"> <div class="derniers_sujets"><span class="gensmall">{catrow.forumrow.LAST_POST}</span></div> </td> </tr> </table> </span> </td> <!-- BEGIN forum_link_no -->
<!-- END forum_link_no --> <!-- BEGIN forum_link --> <td class="row3" colspan="3" align="center" valign="middle" height="50"><span class="gensmall">{catrow.forumrow.forum_link.HIT_COUNT}</span></td> <!-- END forum_link --> </tr> <!-- END forumrow --> <!-- BEGIN catfoot --> <tr> <!-- BEGIN inc --> <td class="{catrow.catfoot.inc.INC_CLASS}" width="46"><img src="{SPACER}" height="0" width="46" /></td> <!-- END inc --> <td class="spaceRow" colspan="{catrow.catfoot.INC_SPAN}" height="1"><img src="{SPACER}" alt="" height="1" width="1" /></td> </tr> <!-- END catfoot --> <!-- BEGIN tablefoot --> </table><img src="{SPACER}" alt="" height="5" width="1" /><!-- END tablefoot --><!-- END catrow --> # Mon CSS (désolée pour le bazar) - Code:
-
body { background-attachment: scroll; background-repeat: no-repeat; background-position: top center; }
.bodyline { background-image: url(""); -moz-border-radius:10px;}
.bodylinewidth { margin-top:0px; }
body { background-image: url("http://img202.imageshack.us/img202/7850/longheader.jpg"); background-repeat: no-repeat }
.row1 { background: url('http://img534.imageshack.us/img534/6704/patterjaune.png'); }
.row2 { background: url('http://img534.imageshack.us/img534/6704/patterjaune.png'); }
.row3 { background: url('http://img534.imageshack.us/img534/6704/patterjaune.png'); }
.row4 { background: url('http://img534.imageshack.us/img534/6704/patterjaune.png'); }
.ombre {text-shadow: #000000 2px 2px 2px;}
a:hover { font-variant: small-caps; }
textarea, .textarea.post, input.post { -moz-border-radius:10px; }
a { text-decoration: none; }
A:hover{text-transform:uppercase;}
a:hover {background-image: "IMAGE";}
.quote {border:1px dotted; border-color: #000000;}
.forumline { border:1px dashed #ffffff; }
.box { -moz-border-radius-bottomleft:0px; -moz-border-radius-bottomright:10px; -moz-border-radius-topleft:10px; -moz-border-radius-topright:0px; background: url("http://i120.photobucket.com/albums/o182/HaleyScott14/forum/transparent.png"); color:#1D2021; font-size:11px; margin:0; padding:3px 10px; }
.boxtitle { -moz-border-radius-bottomleft:5px; -moz-border-radius-bottomright:5px; -moz-border-radius-topleft:5px; -moz-border-radius-topright:5px; background: url("http://i120.photobucket.com/albums/o182/HaleyScott14/forum/transparent.png"); color:#1D2021; display:block; font-size:11px; font-weight:bold; margin:0 0 5px; padding:3px 10px; text-align:center; text-decoration:none; text-transform:uppercase; }
.statistiques{ border:0px; background-image: url("http://img706.imageshack.us/img706/3238/qeel4.png"); background-repeat: no-repeat; background-position: right; height:400px;}
.groupes{ background-image:url("http://img534.imageshack.us/img534/6704/patterjaune.png");border: 1px #ffffff dotted; -moz-border-radius : 5px 1px 5px 1px; height:40px;padding-right:12px;padding-left:14px;padding-bottom:3px; font-size:15px;font-weight: bold;text-align:center; text-decoration: none !important;}
.complet{ border: 2px dashed #C2AE87; background-image: url('URLIMAGE'); background-color: #535A50; background-repeat: no-repeat; text-align: justify; }
td.row3Right, td.spaceRow, td.row3.over:hover { background: url('http://img534.imageshack.us/img534/6704/patterjaune.png'); }
a.mainmenu { background-image: url(""); -moz-border-radius : 10px 10px 10px 10px; height:40px;padding-right:6px;padding-left:7px;padding-bottom:2px; font-size:12px;font-weight: bold;text-align:center; text-shadow: grey 1px 1px 1px; }
a.mainmenu:hover { background-image: url("http://img534.imageshack.us/img534/6704/patterjaune.png"); -moz-border-radius : 10px 10px 10px 10px; height:40px;padding-right:6px;padding-left:7px;padding-bottom:2px; font-size:12px;font-weight: bold;text-align:center; text-shadow: grey 1px 1px 1px; }
a:hover { text-decoration: none !important; }
#lnrbox { position: fixed; bottom: 50px; left: -5px; background-image: url("URL IMAGE"); background-position: center; border: 1px solid #COULEUR; border-bottom: 4px solid #COULEUR; z-index: 999; }
body.chatbox { background-image: url('URLimage'); }
/* INFOBULLE */ a.infobulle { position: relative; } a.infobulle span { display: none; /* ceci masque l'infobulle */ } a.infobulle:hover { background: none; /* correction d'un bug IE */ z-index: 999; /* on définit une valeur pour l'ordre d'affichage */ } a.infobulle:hover span { display: inline; /* ceci affiche l'infobulle */ position: absolute; width: 140px; white-space: nowrap; /* on change la valeur de la propriété white-space pour qu'il n'y ait pas de retour à la ligne non-désiré */ top: 10px; /* on positionne notre infobulle */ left: 20px; background:url('http://img534.imageshack.us/img534/6704/patterjaune.png'); /* arrière-plan de l'infobulle */ color: #000000; /* texte dans l'infobulle */ text-shadow: #ffffff 0px 0px 0px; padding: 1px; /* bordures de votre infobulle*/ border: 1px dashed #ffffff; /* solid=normal, double=double, dashed=pointillé */ -moz-border-radius-bottomleft:5px; /* taille de la bordure */ -moz-border-radius-bottomright:5px; -moz-border-radius-topleft:5px; -moz-border-radius-topright:5px; }
.opacity img { filter:alpha(opacity=70); -moz-opacity:0.5;opacity: 0.5; }
.opacity img:hover { filter:alpha(opacity=100); -moz-opacity:1;opacity: 1; }
.titre { font-family: arial narrow, times new roman, serif; /* Ceci est la police utilisée pour écrire votre titre. Il est conseillé de laisser serif à la fin, c'est la police par défaut (utilisée si les autres polices ne sont pas présentes sur les pc des personnes qui lisent les titres). */ font-size: 140%; /* Détermine la taille de la police. 100% est la taille normale, 110% est donc un peu plus grand */ text-transform: uppercase; /* Soyons fou, écrivons le titre en majuscules ! ^^ */ background-image: url("http://img819.imageshack.us/img819/4388/bardesepcr5.jpg"); /* Et pourquoi ne pas mettre une petite image ? ça décore, ça fait sympa... xD */ border-bottom: 2px "j'efface la ligne" #E37BA6; /* ça, c'est le "soulignement" du titre. Si vous voulez que ce soit un trait plein, remplacez "dashed" par "solid". Pour un trait en pointillé, c'est "dotted". Pour aucun trait du tout, c'est "j'efface la ligne". */ color: #ffffff; /* Couleur de la police ^^ */ text-align: left; /* C'est la classe si le titre est centré, mais on peut l'aligner à droite (right) ou à gauche (left). */ border-left: 1px dotted #COLOR; /* ça, c'est pour faire les petites barres sur le côté du titre... Pour les faire plus large, il suffit de mettre 3px, 4px ou plus à la place de "1px" */ border-right: 1px dotted #COLOR }
.titre { -moz-border-radius-bottomleft:3px; -moz-border-radius-bottomright:3px; -moz-border-radius-topleft:0px; -moz-border-radius-topright:0px; background: url("URL IMAGE"); color:#062A4D; font-size:12px; margin:0; padding:3px 10px; }
tr.post td {padding-left: 10px;}
/*--- Cette partie correspond à la description du forum ---*/ .forum-description { margin: auto; padding: 10px; color:#ffffff; width: 80%; border: 1px solid #COLOR; -moz-border-radius: 2px; -webkit-border-radius: 2px; font-size: 12px; }
/*--- Cette partie correspond à l'onglet "X messages dans X sujets" ---*/ .forum-stats { -moz-border-radius-topleft: 2px; -moz-border-radius-topright: 2px; -webkit-border-top-right-radius: 2px; -webkit-border-top-left-radius: 2px; border-top-right-radius: 2px; border-top-left-radius: 2px; border-bottom: 0 none !important; border-left: 1px solid #COLOR; border-right: 1px solid #COLOR; border-top: 1px solid #COLOR; color: #ffffff; font-size: 11px; font-style: italic; height: 14px; left: 400px; padding: 3px; position: relative; text-align: center; width: 200px; }
/*--- Cette partie correspond à l'affichage des sous-forums ---*/ .forum-sousforum { color: #926DA6; border: 1px solid #823F0C; border-top: 0px !important; -moz-border-radius-bottomleft: 3px; -moz-border-radius-bottomright: 3px; -webkit-border-bottom-right-radius: 3x; -webkit-border-bottom-left-radius: 3px; border-bottom-right-radius: 3px; border-bottom-left-radius: 3px; margin: auto; padding: 4px; color: #926DA6; width: 50%; text-align: center; height: 14px; font-size: 11px; }
.messages_sujets_derniers_sujets { margin-left: 10px; /*espace entre le bord gauche et la bordure*/ padding-top: 2px; /*espace entre le texte et la bordure du haut*/ padding-left: 2px; /*espace entre le texte et la bordure gauche*/ padding-bottom: 5px; /*espace entre le texte et la bordure du bas*/ padding-right: 10px; /*espace entre le texte et la bordure droite*/ border-top: 1px dotted #ffffff; border-left: 1px dotted #ffffff; border-bottom: 0px solid #000000; -moz-border-radius-topleft: 10px; /*arrondir l'angle gauche du haut*/ -moz-border-radius-bottomleft: 10px;/*arrondir l'angle gauche du bas*/ }
/*affichage derniers messages*/ .derniers_sujets { padding: 2px; /*espace entre le texte et la bordure*/ margin: 8px; /*espace entre le bord et la bordure*/ border: 1px dotted #ffffff; -moz-border-radius-topleft: 10px; /*arrondir l'angle gauche du haut*/ -moz-border-radius-bottomright: 10px; /*arrondir l'angle droit du bas*/ text-align: left; }
# Une Capture d'Ecran. J'espere que parmis vous quelqu'un pourra m'aider, j'ai vraiment envie de comprendre ce tuto et de l'utiliser pour mon prochain design que je mettrai en place jeudi.. Merci par avance | | |
|
Haribot' ♪
{ Membre hyper-actif }
Messages : 5163
| Qu'entends-tu par "rester fixe" ? | | |
|
Katie
{ Membre }
Messages : 10
| Bah que ca reste à droite. J'ai fait des tests et a chaque fois que je poste un sujet ou un message, la partie "messages/sujets" et le dernier message se décalnt soit sur la droite soit sur la gauche | | |
|
Kaiji
Blanche-Neige
Messages : 5578
| Bonjour,
Votre problème est-il résolu ?
| | |
|
Katie
{ Membre }
Messages : 10
| Désolée Oui je l'ai résolu le problème toute seule Merci | | |
|