Sujets similaires

Bonjour à tous et à toutes.

Je suis donc en plein dans la mise à jour du design de mon forum. Et qui dit design dit également mise à jour des codes css et templates Modification des Templates, effet catégorie [EN COURS] 1516208530

Modification des Templates, effet catégorie [EN COURS] 1516208530

Débutante, je me débrouille tout de même dans a mise en place des codes grâce au différent tutoriel proposé ici même sur CSS Actif. Cependant, peut-être mes yeux me jouent-ils des tour, mais je n'ai pas retrouvé le tutoriel qui m'intéressais, ou tout du monde qui répondrait à ma question. J'espère donc que ce sujet ne sera pas redondant – ou déjà existant – mais j'aimerais beaucoup qu'un codeur ou une codeuse plus expérimenter me vienne en aide. J'ai donc réussit à mettre des sidebar au-dessus et au-dessous de mes avatars. Cependant, je ne sais pas si c'est un problème d'ordre HTML ou css, mais le résultat n'est pas du tout esthétique (exemple ici). Il y a donc un problème avec la largeur de mes tableaux, j'aimerais qu'ils soient donc de la même largeur que du sidebar.
J'ai essayé au niveau css, en modifiant les tailles itout, mais ça n'a rien changé, pas plus qu'avec la largeur du forum (qui est en %, je jugeais bon de vous le précisez).

Voilà.

Coucou,

Tout d'abord, je suppose que c'est une image non ? Si c'est celle-ci que tu veux à la largeur de ton forum, peut être devrais-tu commencer par la faire à la largeur de ton forum ? C'est la 1ere solution.
Ensuite, pourrais-tu donner les codes que tu as modifié ?

Hello !
Je viens aux nouvelles : ton problème est-il toujours d'actualité ?
Si nous n'avons pas de réponse dans 4 jours, il sera considéré comme résolu !
Merci de ta compréhension Modification des Templates, effet catégorie [EN COURS] 926145

Modification des Templates, effet catégorie [EN COURS] 926145

Oh oui, pardonnez-moi ce silence !
Excuse moi le retard dans ma réponse, Maguitte2008, et merci, par ailleurs, d'avoir prit la peine de te pencher sur ma question (en espérant qu'il ne soit pas trop tard)!

Donc, je ne suis pas certaine que ce soit un soucis avec l'image en question. À vrai dire, j'ai déjà vu des sidebar d'une largeur beaucoup moins grande, et pourtant, l'effet n'était pas le même que sur mon Forum. Je ne pas pense, également, qu'en dépit la panoplie de possibilité qui sont offertes sur Forumactif, nous soyons INCAPABLE de modifier la taille de nos catégories.

En outre, voici les codes que j'ai modifié pour obtenir cette modification quoi que peu concluante jusqu'à présent :

dans le index_box, j'ai modifié:

Code:: <table width="100%" border="0" cellspacing="1" cellpadding="0" align="center">
<tr>
   <td valign="bottom">
      
      <span class="gensmall">{LAST_VISIT_DATE}<br />
      {CURRENT_TIME}<br />
      </span>
      
      <div class="nav"><a class="nav" href="{U_INDEX}">{L_INDEX}</a>{NAV_CAT_DESC}</div>
   </td>
   <td class="gensmall" align="right" valign="bottom">
      
      <a class="gensmall" href="{U_SEARCH_NEW}">{L_SEARCH_NEW}</a><br />
      <a class="gensmall" href="{U_SEARCH_SELF}">{L_SEARCH_SELF}</a><br />
      
      <a class="gensmall" href="{U_SEARCH_UNANSWERED}">{L_SEARCH_UNANSWERED}</a>
   </td>
</tr>
</table>

<table width="100%" cellspacing="0px" cellpading="0px"><tr align="center"><td class="fondtitres"><div class="secondarytitle">{catrow.tablehead.L_FORUM}</div></td></tr></table>

<table class="forumline" border="0" cellspacing="1" cellpadding="0">



<tr>
   
   <td class="{catrow.cathead.inc.INC_CLASS}" width="46"><img src="{SPACER}" height="0" width="46" /></td>
   
   <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>


<tr>
   
   <td class="{catrow.forumrow.inc.INC_CLASS}" width="46"><img src="{SPACER}" height="0" width="46" alt="." /></td>
   
   <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><br />
         </span>
      </h{catrow.forumrow.LEVEL}>
      <span class="genmed">{catrow.forumrow.FORUM_DESC}</span>
      <span class="gensmall">
         
         {catrow.forumrow.switch_moderators_links.L_MODERATOR}{catrow.forumrow.switch_moderators_links.MODERATORS}
         
         {catrow.forumrow.L_LINKS}{catrow.forumrow.LINKS}
      </span>
   </td>
   <td class="row3" align="center" valign="middle" height="50">
      <span class="gensmall">{catrow.forumrow.TOPICS}</span>
   </td>
   <td class="row2" align="center" valign="middle" height="50">
      <span class="gensmall">{catrow.forumrow.POSTS}</span>
   </td>
   <td class="row3 over" align="center" valign="middle" height="50">
      <span class="gensmall">{catrow.forumrow.LAST_POST}</span>
   </td>
</tr>


<tr>
   
   <td class="{catrow.catfoot.inc.INC_CLASS}" width="46"><img src="{SPACER}" height="0" width="46" /></td>
   
   <td class="spaceRow" colspan="{catrow.catfoot.INC_SPAN}" height="1"><img src="{SPACER}" alt="" height="1" width="1" /></td>
</tr>


</table>
<table width="100%" cellspacing="0px" cellpading="0px" style="margin-top:-10px;"><tr align="center">
<td class="fondbascategorie"><div class="secondarytitle">{catrow.tablehead.L_FORUM}</div>
</td></tr></table>

ce que j'ai modifié ensuite dans le overall_header :

Code:: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" dir="{S_CONTENT_DIRECTION}" id="min-width" lang="{L_LANG_HTML}" xml:lang="{L_LANG_HTML}" {NAMESPACE_FB_LIKE} {NAMESPACE_FB} {NAMESPACE_BBCODE}>
<head>
<title>{SITENAME_TITLE}{PAGE_TITLE}</title>
<meta http-equiv="content-type" content="text/html; charset={S_CONTENT_ENCODING}" />
<meta http-equiv="content-script-type" content="text/javascript" />
<meta http-equiv="content-style-type" content="text/css" />

<meta http-equiv="X-UA-Compatible" content="IE={switch_compat_meta.VERSION}" />


<link rel="canonical" href="{switch_canonical_url.CANONICAL_URL}" />

{META_FAVICO}
{META}
{META_FB_LIKE}
<meta name="title" content="{SITENAME_TITLE}{PAGE_TITLE}" />
{T_HEAD_STYLESHEET}
{CSS}
<link rel="search" type="application/opensearchdescription+xml" href="/improvedsearch.xml" title="{SITENAME}" />
<link rel="search" type="application/opensearchdescription+xml" href="{URL_BOARD_DIRECTORY}/search/improvedsearch.xml" title="{SEARCH_FORUMS}" />
<script src="{JQUERY_PATH}" type="text/javascript"></script>
<script src="{JS_DIR}{L_LANG}.js" type="text/javascript"></script>


<script src="http://connect.facebook.net/{switch_fb_login.FB_LOCAL}/all.js" type="text/javascript"></script>
<script src="{switch_fb_login.JS_FB_LOGIN}" type="text/javascript"></script>



<link type="text/css" rel="stylesheet" href="{JS_DIR}jquery/ticker/ticker.css" />
<script src="{JS_DIR}jquery/ticker/ticker.js" type="text/javascript"></script>



<script src="{JS_DIR}jquery/jcarousel/jquery.jcarousel.js" type="text/javascript"></script>
<script type="text/javascript">//<![CDATA[
   /* Definir le sens de direction en fonction du panneau admin */
   var tickerDirParam = "{switch_ticker.DIRECTION}";
   var slid_vert = false;
   var auto_dir = 'next';
   var h_perso = parseInt({switch_ticker.HEIGHT});

   switch( tickerDirParam )
   {
      case 'top' :
         slid_vert = true;
         break;

      case 'left':
         break;

      case 'bottom':
         slid_vert = true;
         auto_dir = 'prev';
         break;

      case 'right':
         auto_dir = 'prev';
         break;

      default:
         slid_vert = true;
   }

   $(document).ready(function() {
      var w_cont = $('#fa_ticker_container').width();

      if (w_cont > 0)
      {
         $('#fa_ticker_container').width(w_cont);

         /* Affichage de la liste */
         $('#fa_ticker_content').css('display','block');

         /* Calcul des dimensions du conteneur et des elements */
         var width_max = $('ul#fa_ticker_content').width();
         var width_item = Math.floor(width_max / {switch_ticker.SIZE});
         var height_max = h_perso;

         /* Calcul de la hauteur maximale du conteneur en fonction des elements et de la hauteur personnalisee dans l'admin */
         $('ul#fa_ticker_content li').each( function () {
            if ($(this).height() > height_max)
            {
               height_max = $(this).height();
            }
         } );

         /* Redimensionnement des elements et des images trop larges */
         $('ul#fa_ticker_content li').width(width_item).height(height_max).find('img').each(function () {
            if ($(this).width() > width_item)
            {
            var ratio    = $(this).width() / width_item;
            var new_height = Math.round($(this).height() / ratio);
            $(this).height(new_height).width(width_item);
            }
         });

         /* Redimensionnement et centrage du conteneur en mode vertical */
         if (slid_vert)
         {
            $('ul#fa_ticker_content').width(width_item).height(height_max).css('marginLeft','auto').css('marginRight','auto');
         }

         /* Initialisation du caroussel */
         $('#fa_ticker_content').jcarousel({
               vertical: slid_vert,
            wrap: 'circular',
            auto: {switch_ticker.STOP_TIME},
            auto_direction: auto_dir,
         scroll: 1,
         size: {switch_ticker.SIZE},
         height_max: height_max,
         animation: {switch_ticker.SPEED}
         });
      }
      else
      {
         $('ul#fa_ticker_content li:not(:first)').css('display','none');
         $('ul#fa_ticker_content li:first').css('list-style','none').css('text-align','center');
      }
   });
//]]>
</script>


<script type="text/javascript">//<![CDATA[
$(document).ready(function(){
   
      pm = window.open('{U_PRIVATEMSGS_POPUP}', '_faprivmsg', 'HEIGHT=225,resizable=yes,WIDTH=400');
      pm.focus();
   
   
      report = window.open('{switch_report_popup.U_REPORT_POPUP}', '_phpbbreport', 'HEIGHT={switch_report_popup.S_HEIGHT},resizable=yes,scrollbars=no,WIDTH={switch_report_popup.S_WIDTH}');
      report.focus();
   
   
      ticker_start({switch_ticker.HEIGHT}, {switch_ticker.SPACING}, {switch_ticker.SPEED}, '{switch_ticker.DIRECTION}', {switch_ticker.STOP_TIME});
   
});


   var logInPopUpLeft, logInPopUpTop, logInPopUpWidth = {LOGIN_POPUP_WIDTH}, logInPopUpHeight = {LOGIN_POPUP_HEIGHT}, logInBackgroundResize = true, logInBackgroundClass = false;



$(document).ready( function() {
   $(window).resize(function() {
      var windowWidth = document.documentElement.clientWidth;
      var popupWidth = $("#login_popup").width();
      var mypopup = $("#login_popup");

      $("#login_popup").css({
      "left": windowWidth/2 - popupWidth/2
         });
   });
});

//]]>
</script>
{GREETING_POPUP}

<style>
.jcarousel-skin-tango .jcarousel-item {
   text-align:center;
   width: 10px;
}

.jcarousel-skin-tango .jcarousel-item-horizontal {
   margin-right: {switch_ticker.SPACING}px;
}

.jcarousel-skin-tango .jcarousel-item-vertical {
   margin-bottom: {switch_ticker.SPACING}px;
}
</style>

{HOSTING_JS}

<script type="text/javascript">
//<![CDATA[
   var _gaq = _gaq || [];
   _gaq.push(['_setAccount', '{G_ANALYTICS_ID}']);
   _gaq.push(['_trackPageview']);
_gaq.push(['_trackPageLoadTime']);


_gaq.push(['b._setAccount', '{G_ANALYTICS_ID_BIS}']);
_gaq.push(['b._trackPageview']);


   (function() {
   var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
   ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
   var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
   })();
//]]>
</script>

</head>
<body background="{T_BODY_BACKGROUND}" bgcolor="{T_BODY_BGCOLOR}" text="{T_BODY_TEXT}" link="{T_BODY_LINK}" vlink="{T_BODY_VLINK}">

<div id="hitskin_preview" style="display: block;">
   <h1><img src="http://2img.net/i/fa/hitskin/hitskin_logo.png" alt="" /> Hit<em>skin</em>.com</h1>
   <div class="content">
      <p>
         {hitskin_preview.L_THEME_SITE_PREVIEW}
         <br />
         <span>{hitskin_preview.U_INSTALL_THEME}<a href="http://{hitskin_preview.U_RETURN_THEME}">{hitskin_preview.L_RETURN_THEME}</a></span>
      </p>
   </div>
</div>



<div id="login_popup">
   <table class="forumline" width="{LOGIN_POPUP_WIDTH}" height="{LOGIN_POPUP_HEIGHT}" border="0" cellspacing="1" cellpadding="0">
      <tr height="25">
         <td class="catLeft">
            <span class="genmed module-title">{SITENAME}</span>
         </td>
      </tr>
      <tr height="{LOGIN_POPUP_MSG_HEIGHT}">
         <td class="row1" align="left" valign="top">
            <div id="login_popup_buttons">
               <form action="{S_LOGIN_ACTION}" method="get">
                  <input type="submit" class="mainoption" value="{L_LOGIN}" />
                  <input type="button" class="mainoption" value="{L_REGISTER}" onclick="parent.location='{U_REGISTER}';" />
                  <input id="login_popup_close" type="button" class="button" value="{L_DONT_DISPLAY_AGAIN}" />
               </form>
            </div>
            <span class="genmed">{LOGIN_POPUP_MSG}</span>
         </td>
      </tr>
   </table>
</div>
   

<a name="top"></a>
{JAVASCRIPT}
<div class="navtop"><table cellspacing="0" cellpadding="0" border="0" align="{MENU_POSITION}">
<tr>
<td align="{MENU_POSITION}"{MENU_NOWRAP}>{GENERATED_NAV_BAR}</td>
</tr>
</table></div>
<table class="bodylinewidth" width="{T_BODY_TABLE_WIDTH}" cellspacing="0" cellpadding="10" border="0" align="center">
<tr>
<td class="bodyline">
<table width="100%" cellspacing="0" cellpadding="0" border="0">
<tr>

               <td><a href="{U_INDEX}"><img src="{LOGO}" id="i_logo" border="0" alt="{L_INDEX}" vspace="1" /></a></td>
               
               <td align="center" width="100%" valign="middle">
                  
                  <a href="{U_INDEX}"><img src="{LOGO}" id="i_logo" border="0" alt="{L_INDEX}" vspace="1" /></a>
                  <br />
                  
                  <div class="maintitle">{MAIN_SITENAME}</div>
                  <br />
                  <span class="gen">{SITE_DESCRIPTION}<br /> </span>
               </td>
               
               <td><a href="{U_INDEX}"><img src="{LOGO}" id="i_logo" border="0" alt="{L_INDEX}" vspace="1" /></a></td>
               
            </tr>
         </table>



         <div style="clear: both;"></div>

         
         <div id="fa_ticker_block" style="margin-top:4px;margin-bottom:4px;">
            <table width="100%" border="0" cellspacing="0" cellpadding="0" class="forumline">
               <tr>
                  <td {CLASS_TABLE_TYPE} align="left" class="row1">
                     <div id="fa_ticker_container">
                        <ul id="fa_ticker_content" class="jcarousel-skin-tango" style="display:none;">
                           
                           <li>{switch_ticker.ticker_row.ELEMENT}</li>
                           
                        </ul>
                     </div>
                  </td>
               </tr>
            </table>
         </div>
         

         
         <div id="fa_ticker_block" style="margin-top:4px;margin-bottom:4px;">
            <table width="100%" border="0" cellspacing="0" cellpadding="0" class="forumline">
               <tr>
                  <td {CLASS_TABLE_TYPE} align="left" class="row1">
                     <div id="fa_ticker_container">
                        <div id="fa_ticker" style="height:{switch_ticker.HEIGHT}px;">
                           <div class="fa_ticker_content">
                              
                              <div>{switch_ticker.ticker_row.ELEMENT}</div>
                              
                           </div>
                        </div>
                     </div>
                  </td>
               </tr>
            </table>
         </div>
         

         <div id="page-body">
            <div id="{ID_CONTENT_CONTAINER}"{CLASS_CONTENT_CONTAINER}>
               <table cellpadding="0" cellspacing="0" width="100%" class="three-col">
                  <tbody>
                     <tr>
                        <td valign="top" width="{C1SIZE}">
                           <div id="{ID_LEFT}">
                              
                              {giefmod_index1.MODVAR}
                                 
                                 <div style="height:{SPACE_ROW}px"></div>
                                 
                              
                           </div>
                        </td>
                        <td valign="top" width="100%">

                        </td>
                     </tr>
                  </tbody>
               </table>
            </div>
         </div>
      </td>
   </tr>
</table>
</body>
</html>

et puis ce que j'ai modifié dans le viewtopic_body

Code:: <script type="text/javascript">
//<![CDATA[
var multiquote_img_off = '{JS_MULTIQUOTE_IMG_OFF}', multiquote_img_on = '{JS_MULTIQUOTE_IMG_ON}', _atr = '{JS_DIR}addthis/', _ati = '{PATH_IMG_FA}addthis/'{ADDTHIS_LANG}, addthis_localize = { share_caption: "{L_SHARE_CAPTION}", email: "{L_EMAIL}", email_caption: "{L_EMAIL_CAPTION}", favorites: "{L_SHARE_BOOKMARKS}", print: "{L_PRINT}", more: "{L_MORE}" };
$(function(){
_atc.cwait = 0;
$('.addthis_button').mouseup(function(){
   if ($('#at15s').css('display') == 'block') {
      addthis_close();
      addthis_close();
   }
});
});
//]]>
</script>

<table width="100%" border="0" cellspacing="2" cellpadding="0">
<tr>
   <td align="left" valign="middle" nowrap="nowrap">
      <span class="nav">
      
      <a href="{U_POST_NEW_TOPIC}" rel="nofollow"><img src="{POST_IMG}" id="{POST_IMG_ID}one" alt="{L_POST_NEW_TOPIC}" align="middle" border="0" /></a>
      
      
      <a href="{U_POST_REPLY_TOPIC}"><img src="{REPLY_IMG}" id="i_reply" alt="{L_POST_REPLY_TOPIC}" align="middle" border="0" /></a>
      
      </span>
   </td>
   <td align="left" valign="middle" nowrap="nowrap">
      
      <span id="twitter_btn" style="margin-left: 6px; ">
      <a href="http://twitter.com/share" class="twitter-share-button" data-count="horizontal">Tweet</a>
      <script type="text/javascript" src="http://platform.twitter.com/widgets.js"></script>
      </span>
      
      
      <span id="fb_likebtn" style="margin-left: 6px; ">
         <iframe src="http://www.facebook.com/plugins/like.php?href={FORUM_URL}{TOPIC_URL}&layout=button_count&show_faces=false&width=100&action=like&colorscheme=light&height=21" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:100px; height:21px;" allowTransparency="true"></iframe>
      </span>
      
   </td>
   <td class="nav" valign="middle" width="100%"><span class="nav"><a class="nav" href="{U_INDEX}">{L_INDEX}</a>{NAV_SEP}<a class="nav" href="{U_ALBUM}">{L_ALBUM}</a>{NAV_CAT_DESC_SECOND}</span></td>
   <td align="right" valign="bottom" nowrap="nowrap" width="100%">
      <span class="gensmall bold">
         <a class="addthis_button" href="http://www.addthis.com/bookmark.php?v=250&pub=forumotion">{L_SHARE}</a>
         
           |
         <script type="text/javascript">//<![CDATA[
            var url_favourite = '{U_FAVOURITE_JS_PLUS_MENU}';
            var url_newposts = '{U_NEWPOSTS_JS_PLUS_MENU}';
            var url_egosearch = '{U_EGOSEARCH_JS_PLUS_MENU}';
            var url_unanswered = '{U_UNANSWERED_JS_PLUS_MENU}';
            var url_watchsearch = '{U_WATCHSEARCH_JS_PLUS_MENU}';
            var url_tellfriend = '{U_TELLFRIEND_JS_PLUS_MENU}';
            insert_plus_menu('f{FORUM_ID}&t={TOPIC_ID}','{JS_SESSION_ID}', {JS_AUTH_FAVOURITES});
         //]]>
         </script>
         
      </span>
   </td>
</tr>
</table>

<table class="forumline" width="100%" border="0" cellspacing="1" cellpadding="0" style="border-bottom: 0px;">
<tr align="right">
   <td class="catHead" colspan="3" height="28">
      <table width="100%" border="0" cellspacing="0" cellpadding="0">
         <tr>
            <td width="9%" class="noprint"> </td>
            <td align="center" class="t-title">
               <h1 class="cattitle"> {TOPIC_TITLE}</h1>
            </td>
            <td align="right" width="9%" class="browse-arrows"><a href="{U_VIEW_OLDER_TOPIC}">{L_VIEW_PREVIOUS_TOPIC}</a> <a href="{U_VIEW_NEWER_TOPIC}">{L_VIEW_NEXT_TOPIC}</a> <a href="#bottom">{L_GOTO_DOWN}</a> </td>
         </tr>
      </table>
   </td>
</tr>

<tr>
   <td class="row1 pagination" colspan="2" align="right" valign="top"><span class="gensmall">{PAGINATION}</span></td>
</tr>

{POLL_DISPLAY}
<tr>
   <th class="thLeft" nowrap="nowrap" width="150px" height="26">{L_AUTHOR}</th>
   <th class="thRight" nowrap="nowrap" colspan="2">{L_MESSAGE}</th>
</tr>


<tr class="post">
   <td class="{postrow.displayed.ROW_CLASS}"{postrow.displayed.THANK_BGCOLOR} valign="top" width="150">
      <span class="name"><a name="{postrow.displayed.U_POST_ID}"></a></span><br />
         <span class="postdetails poster-profile">
         <br />
         {postrow.displayed.RANK_IMAGE}
<div class="imgprofil"><img src="http://i10.servimg.com/u/f10/18/09/66/24/cadre110.gif"></div><br>{postrow.displayed.POSTER_AVATAR}<br /><strong>{postrow.displayed.POSTER_NAME}</strong><br />
         
         {postrow.displayed.profile_field.LABEL} {postrow.displayed.profile_field.CONTENT}{postrow.displayed.profile_field.SEPARATOR}
         
         {postrow.displayed.POSTER_RPG}
      </span><br />
      <img src="http://2img.net/i/fa/empty.gif" alt="" style="width:150px;height:1px" />
   </td>
   <td class="{postrow.displayed.ROW_CLASS}"{postrow.displayed.THANK_BGCOLOR} valign="top" width="100%" height="28" colspan="2">
      <table width="100%" border="0" cellspacing="0" cellpadding="0">
         <tr>
            <td><span class="postdetails"><img src="{postrow.displayed.MINI_POST_IMG}" alt="{postrow.displayed.L_MINI_POST_ALT}" title="{postrow.displayed.L_MINI_POST_ALT}" border="0" />{L_POST_SUBJECT}: {postrow.displayed.POST_SUBJECT} <img src="{postrow.displayed.MINI_TIME_IMG}" alt="" border="0" />{postrow.displayed.POST_DATE}</span></td>
            <td valign="top" nowrap="nowrap" class="post-options">
               {postrow.displayed.THANK_IMG} {postrow.displayed.MULTIQUOTE_IMG} {postrow.displayed.QUOTE_IMG} {postrow.displayed.EDIT_IMG} {postrow.displayed.DELETE_IMG} {postrow.displayed.IP_IMG} {postrow.displayed.REPORT_IMG}
            </td>
         </tr>
         <tr>
            <td colspan="2" class="hr">
               <hr />
            </td>
         </tr>
         <tr>
            <td colspan="2">
               
               <div class="vote gensmall">
                  
                  <div class="vote-button"><a href="{postrow.displayed.switch_vote_active.switch_vote.U_VOTE_PLUS}">+</a></div>
                  

                  
                  <div class="vote-bar" title="{postrow.displayed.switch_vote_active.L_VOTE_TITLE}">
                     
                     <div class="vote-bar-plus" style="height:{postrow.displayed.switch_vote_active.switch_bar.switch_vote_plus.HEIGHT_PLUS}px;"></div>
                     

                     
                     <div class="vote-bar-minus" style="height:{postrow.displayed.switch_vote_active.switch_bar.switch_vote_minus.HEIGHT_MINUS}px;"></div>
                     
                  </div>
                  

                  
                  <div title="{postrow.displayed.switch_vote_active.L_VOTE_TITLE}" class="vote-no-bar">----</div>
                  

                  
                  <div class="vote-button"><a href="{postrow.displayed.switch_vote_active.switch_vote.U_VOTE_MINUS}">-</a></div>
                  
               </div>
               

               <div class="postbody">

                  <div>{postrow.displayed.MESSAGE}</div>

                  
                  <dl class="attachbox">
                     <dt>{postrow.displayed.switch_attachments.L_ATTACHMENTS}</dt>
                     <dd>
                        
                        <dl class="file">
                           <dt>
                              <img src="{postrow.displayed.switch_attachments.switch_post_attachments.U_IMG}" />

                              
                              <a class="postlink" href="{postrow.displayed.switch_attachments.switch_post_attachments.switch_dl_att.U_ATTACHMENT}">{postrow.displayed.switch_attachments.switch_post_attachments.switch_dl_att.ATTACHMENT}</a> {postrow.displayed.switch_attachments.switch_post_attachments.switch_dl_att.ATTACHMENT_DEL}
                              

                              
                              {postrow.displayed.switch_attachments.switch_post_attachments.switch_no_dl_att.ATTACHMENT} {postrow.displayed.switch_attachments.switch_post_attachments.switch_no_dl_att.ATTACHMENT_DEL}
                              
                           </dt>

                           
                           <dd>
                              <em>{postrow.displayed.switch_attachments.switch_post_attachments.switch_no_comment.ATTACHMENT_COMMENT}</em>
                           </dd>
                           

                           
                           <dd>
                              <em><strong>{postrow.displayed.switch_attachments.switch_post_attachments.switch_no_dl_att.TEXT_NO_DL}</strong></em>
                           </dd>
                           

                           <dd>({postrow.displayed.switch_attachments.switch_post_attachments.FILE_SIZE}) {postrow.displayed.switch_attachments.switch_post_attachments.NB_DL}</dd>
                        </dl>
                        
                     </dd>
                  </dl>
                  

                  <div class="clear"></div>
                  <div class="signature_div">
                     {postrow.displayed.SIGNATURE}
                  </div>

               </div>
               <span class="gensmall">{postrow.displayed.EDITED_MESSAGE}</span>
            </td>
         </tr>
      </table>
   </td>
</tr>
<tr>
   <td class="{postrow.displayed.ROW_CLASS} browse-arrows"{postrow.displayed.THANK_BGCOLOR} align="center" valign="middle" width="150">
      <a href="#top">{L_BACK_TO_TOP}</a> <a href="#bottom">{L_GOTO_DOWN}</a>
   </td>
   <td class="{postrow.displayed.ROW_CLASS} messaging gensmall"{postrow.displayed.THANK_BGCOLOR} width="100%" height="28">
      <table border="0" cellspacing="0" cellpadding="0">
         <tr>
            <td valign="middle">
               {postrow.displayed.PROFILE_IMG} {postrow.displayed.PM_IMG} {postrow.displayed.EMAIL_IMG} {postrow.displayed.contact_field.CONTENT} {postrow.displayed.ONLINE_IMG}
            </td>
         </tr>
      </table>
   </td>
</tr>

</table>
<br />
<table class="forumline" width="100%" border="0" cellspacing="1" cellpadding="0">
<tr>
   <th class="thLeft" nowrap="nowrap" width="150px" height="26">{L_AUTHOR}</th>
   <th class="thRight" nowrap="nowrap" colspan="2">{L_MESSAGE}</th>
</tr>



<tr>
   <td class="postdetails {postrow.hidden.ROW_CLASS}" colspan="2" align="center">{postrow.hidden.MESSAGE}</td>
</tr>



<tr align="center">
   <td class="row1" colspan="3" height="28">
      <span class="genmed">{no_post.L_NO_POST}</span>
   </td>
</tr>

<tr align="right">
   <td class="catBottom" colspan="3" height="28">
      <table width="100%" border="0" cellspacing="0" cellpadding="0">
         <tr>
            <td width="9%" class="noprint"> </td>
            <td align="center" class="t-title"><a name="bottomtitle"></a><h1 class="cattitle">{TOPIC_TITLE}</h1></td>
            <td align="right" nowrap="nowrap" width="9%" class="browse-arrows"><a href="{U_VIEW_OLDER_TOPIC}">{L_VIEW_PREVIOUS_TOPIC}</a> <a href="{U_VIEW_NEWER_TOPIC}">{L_VIEW_NEXT_TOPIC}</a> <a href="#top">{L_BACK_TO_TOP}</a> </td>
         </tr>
      </table>
   </td>
</tr>
</table>
<table class="forumline noprint" width="100%" border="0" cellspacing="0" cellpadding="0" style="margin: 0 0 1px 0; border-top: 0px;">
<tr>
   <td class="row2" valign="top" {COLSPAN_PAGINATION} width="150"><span class="gensmall">{PAGE_NUMBER}</span></td>
   
   <td class="row1" align="right" valign="top" ><span class="gensmall">{PAGINATION}</span></td>
   
</tr>


<tr>
   <td class="row2" colspan="2" align="right" valign="top"><span class="gensmall">{S_WATCH_TOPIC}</span></td>
</tr>


</table>


<table class="forumline" width="100%" border="0" cellpadding="1" cellspacing="0" id="ptrafic_close" style="display:none;margin: 1px 0px 1px 0px">
<tr>
   <td class="catBottom" height="28">
      <table width="100%" border="0" cellspacing="0" cellpadding="0">
         <tr>
            <td valign="top"><h1 class="cattitle"> {PROMOT_TRAFIC_TITLE}</h1></td>
            <td align="right" valign="middle" width="10"><span class="gensmall"><a href="javascript:ShowHideLayer('ptrafic_open','ptrafic_close');"><img src="{TABS_MORE_IMG}" alt="+" align="middle" border="0" /></a></span></td>
         </tr>
      </table>
   </td>
</tr>
</table>

<table class="forumline" width="100%" border="0" cellpadding="1" cellspacing="0" id="ptrafic_open" style="display:'';margin: 1px 0px 1px 0px">
<tr>
   <td class="catBottom" height="28">
      <table width="100%" border="0" cellspacing="0" cellpadding="0">
         <tr>
            <td valign="top"><h1 class="cattitle"> {PROMOT_TRAFIC_TITLE}</h1></td>
            <td align="right" valign="middle" width="10"><span class="gensmall"><a href="javascript:ShowHideLayer('ptrafic_open','ptrafic_close');"><img src="{TABS_LESS_IMG}" alt="-" align="middle" border="0" /></a></span></td>
         </tr>
      </table>
   </td>
</tr>
<tr>
   <td class="row2 postbody" valign="top">
      
      » <a style="text-decoration:none" href="{promot_trafic.link.U_HREF}" target="_blank" title="{promot_trafic.link.TITLE}">{promot_trafic.link.TITLE}</a><br />
      
   </td>
</tr>
</table>



<table id="forum_rules" class="forumline" width="100%" border="0" cellspacing="0" cellpadding="0" style="margin: 1px 0px 1px 0px">
<tbody>
   <tr>
      <td class="catBottom">
         <table width="100%" border="0" cellspacing="0" cellpadding="0">
            <tbody>
               <tr>
                  <td valign="top">
                     <h1 class="cattitle"> {L_FORUM_RULES}</h1>
                  </td>
               </tr>
            </tbody>
         </table>
      </td>
   </tr>
   <tr>
      <td class="row1 clearfix">
         <table>
            <tr>
               
               <td class="logo">
                  <img src="{RULE_IMG_URL}" />
               </td>
               
               <td class="rules postbody">
                  {RULE_MSG}
               </td>
            </tr>
         </table>
      </td>
   </tr>
</tbody>
</table>


<table class="forumline noprint" width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
   <td class="row2" colspan="2" align="center" style="padding:0px">
      
      <a name="quickreply"></a>
      {QUICK_REPLY_FORM}<br />
      
   </td>
</tr>
<tr>
   <td style="margin:0; padding: 0;" colspan="2">
      <table border="0" cellpadding="0" width="100%" cellspacing="0" id="info_open" style="display:''">
         <tbody>
   
   <tr>
      <td class="row2" valign="top" width="25%"><span class="gensmall">{L_TABS_PERMISSIONS}</span></td>
      <td class="row1" valign="top" width="75%"><span class="gensmall">{S_AUTH_LIST}</span></td>
   </tr>
   
   <tr>
      <td class="catBottom" colspan="2" height="28">
         <table width="100%" border="0" cellspacing="0" cellpadding="0">
            <tr>
               <td valign="middle" width="100%"><span class="nav"><a class="nav" href="{U_INDEX}">{L_INDEX}</a>{NAV_SEP}<a class="nav" href="{U_ALBUM}">{L_ALBUM}</a>{NAV_CAT_DESC_SECOND}</span></td>
               
               <td align="right" valign="middle"><span class="gensmall"><a href="javascript:ShowHideLayer('info_open','info_close');"><img src="{TABS_LESS_IMG}" alt="-" align="middle" border="0" /></a></span></td>
               
            </tr>
         </table>
      </td>
   </tr>
</tbody>
      </table>
   </td>
</tr>
<tr>
   <td style="margin:0; padding: 0;" colspan="2">
      <table border="0" cellpadding="0" cellspacing="0" width="100%" id="info_close" style="display:none;">
         <tbody>
   <tr>
      <td class="catBottom" colspan="2" height="28">
         <table width="100%" border="0" cellspacing="0" cellpadding="0">
            <tr>
               <td valign="middle" width="100%"><span class="nav"><a class="nav" href="{U_INDEX}">{L_INDEX}</a>{NAV_SEP}<a class="nav" href="{U_ALBUM}">{L_ALBUM}</a>{NAV_CAT_DESC_SECOND}</span></td>
               <td align="right" valign="middle"><span class="gensmall"><a href="javascript:ShowHideLayer('info_open','info_close');"><img src="{TABS_MORE_IMG}" alt="+" align="middle" border="0" /></a></span></td>
            </tr>
         </table>
      </td>
   </tr>
</tbody>
      </table>
   </td>
</tr>
</table>

<form action="{S_JUMPBOX_ACTION}" method="get" name="jumpbox" onsubmit="if(document.jumpbox.f.value == -1){return false;}">
<table class="noprint" width="100%" border="0" cellspacing="2" cellpadding="0" align="center">
<tr>
   <td align="left" valign="middle" nowrap="nowrap" {WIDTH_GALLERY}>
      <span class="nav">
         
         <a href="{U_POST_NEW_TOPIC}" rel="nofollow"><img src="{POST_IMG}" id="{POST_IMG_ID}Newtopic" alt="{L_POST_NEW_TOPIC}" align="middle" border="0" /></a>
         
         
         <a href="{U_POST_REPLY_TOPIC}"><img src="{REPLY_IMG}" alt="{L_POST_REPLY_TOPIC}" align="middle" border="0" /></a>
         
      </span>
   </td>

   
   <td align="right" nowrap="nowrap"><span class="gensmall">{L_JUMP_TO}: {S_JUMPBOX_SELECT} <input class="liteoption" type="submit" value="{L_GO}" /></span></td>
   

   
   <td align="center">
      <span class="gensmall">{moderation_panel.U_YOUR_PERSONAL_MODERATE}</span>
   </td>
   <td align="center" width="250">
      <span class="gensmall"> </span>
   </td>
   
</tr>
</table>
</form>


<table class="noprint" width="100%" border="0" cellspacing="2" cellpadding="0" align="center">
<tr>
   <td colspan="2" align="left" valign="top" nowrap="nowrap"><br />{S_TOPIC_ADMIN}<br />
      <form name="action" method="get" action="{S_FORM_MOD_ACTION}">
         <input type="hidden" name="t" value="{TOPIC_ID}" />

         
         <input type="hidden" name="{SECURE_ID_NAME}" value="{SECURE_ID_VALUE}" />

         <span class="gen">{L_MOD_TOOLS}<br />{S_SELECT_MOD} <input class="liteoption" type="submit" value="{L_GO}" /></span>
      </form>
   </td>
</tr>
</table>



<script type="text/javascript">
//<![CDATA[
$(resize_images({ 'selector' : '.postbody', 'max_width' : {switch_image_resize.IMG_RESIZE_WIDTH}, 'max_height' : {switch_image_resize.IMG_RESIZE_HEIGHT} }));
//]]>
</script>

<script src="{JS_DIR}addthis/addthis_widget.js" type="text/javascript"></script>

J'ai également ajouté du css dans le tout :

Code:: .imgprofil {
margin-top:100px;
}

body {background-repeat: no-repeat;}

a.mainmenu {
color:#612834;
letter-spacing: X px;
text-transform: lowercase; /*pour l'avoir en minuscules*/
font-family: times new roman;
font-size:18pt; /*la taille*/
font-weight:bold; /*pour l'avoir en gras, donc si tu le veux en "normal" tu enlèves cette ligne*/
font-style:italic; /*italique au survol, pareil si tu veux pas cet effet, tu enlèves cette ligne*/
}

a.mainmenu:hover {/*barre de navigation au survol*/
color:#363738;
font-style:italic; /*italique au survol, pareil si tu veux pas cet effet, tu enlèves cette ligne*/
}

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

.fondtitres{
width: 500px; /* changeable selon la largeur de ton forum*/
height: 160px; /* changeable selon la largeur des images*/
text-align: center;
background: url('http://i46.tinypic.com/ra9qpj.png');
background-position:bottom center;
background-repeat: no-repeat;
margin: auto;
}

.fondbascategorie {
width: 500px; /* changeable selon la largeur de ton forum*/
height: 160px; /* changeable selon la largeur des images*/
background: url('http://i48.tinypic.com/f3wgy.png');
background-position:top center;
background-repeat: no-repeat;
margin-top: 2px;
}

Et pour le message d'accueil :

Code:: <table style="position: fixed; bottom: 40px; left: 0px;background-color: #06070B;z-index:10000;"><tr><td><iframe src="/chatbox/index.forum?page=front&" id="chatboxpop" scrolling="no" style="width: 1150px; height: 350px; display: none;" marginwidth="0" marginheight="0" frameborder="0"></iframe></td><td style="vertical-align: bottom;"><img src="http://i50.tinypic.com/1zwytzq.jpg" onClick="document.getElementById('chatboxpop').style.display=(this.src=='http://i50.tinypic.com/1zwytzq.jpg')?'block':'none';this.src=(this.src=='http://i50.tinypic.com/1zwytzq.jpg')?'http://i48.tinypic.com/1z5rvd4.jpg':'http://i50.tinypic.com/1zwytzq.jpg';"/></td></tr></table>
<img src="http://i47.tinypic.com/30i9b8n.png" border="0" alt="" />

Voilà donc tous les codes que j'ai modifié jusqu'à présent.

Bonjour,

Qu'est-ce que tu veux dire par "sidebar au dessus et en dessous de tes avatars" ? Tu ne veux pas plutôt dire que tu places des images en en-tête (header) et pied (footer) de tes catégories ? (Ce qui implique que le seul template concerné est le index_box)

Si c'est bien ça, tu peux déjà commencer par retirer cette table à une ligne et une colonne (je ne sais pas qui distribue des tutoriels avec un contenu aussi idiot mais si c'est sur CSSActif ça ne va pas tarder à être éradiqué) :

Code:: <table width="100%" cellspacing="0px" cellpading="0px"><tr align="center"><td class="fondtitres"><div class="secondarytitle">{catrow.tablehead.L_FORUM}</div></td></tr></table>

Au profit de quelque chose de plus simple :

Code:: <div class="secondarytitle categorie-header">{catrow.tablehead.L_FORUM}</div>
<div class="categorie-content">

Et de même en bas, retirer ce code :

Code:: <table width="100%" cellspacing="0px" cellpading="0px" style="margin-top:-10px;"><tr align="center">
<td class="fondbascategorie"><div class="secondarytitle">{catrow.tablehead.L_FORUM}</div>
</td></tr></table>

Au profit d'un nettement plus basique équivalent :

Code:: </div> 
<div class="categorie-footer"></div>

Il te faudra juste renommer ta classe .fondbascategorie par .categorie-footer pour le coup.

Et du coup on a trois classes : .categorie-header, .categorie-content et .categorie-footer.

Il ne te reste plus qu'à :

Attribuer une largeur équivalente à ces trois classes
Préciser une hauteur et une image de fond aux deux classes .categorie-header et .categorie-footer
T'assurer que l'image de fond en question ne se répète pas, bien sûr
Positionner proprement le titre en t'aidant du sélecteur .secondarytitle h2 si je ne me trompe pas (étant au boulot, je ne peux pas vérifier)

Bon courage Wink

Je ne suis pas certaine de comprendre...
À vrai dire, je ne comprends pas du tout ce que tu veux modifier. Surtout le passage du .fondbascategorie ?

Ah non, mais je comprends ! Et je veux le faire seule, pour apprendre itou, mais je ne suis pas certaine de comprendre le "texte" à modifier. Je veux dore, n'y a-t-il pas le lien de mes images à insérées quelque part ?

Bonsoir,

~~Je te rappelle que les double-posts ne sont pas autorisés, et que la fonction existe. Merci de (re)lire le règlement si nécessaire.~~

Cela fait cinq jours que nous sommes sans nouvelles. Résolu ? Si oui, merci de nous le dire sous quatre jours, sans quoi ce sujet sera archivé.

Merci de ta compréhension. Modification des Templates, effet catégorie [EN COURS] 510527

Edit : Retrait. Modification des Templates, effet catégorie [EN COURS] 926145

Le double post est de ma faute, j'avais posté par erreur avec le compte d'Orange (non, je ne l'usurpe pas !) et je l'ai supprimé.

Bref.

Pour répondre à ta question, CAF-POW, tu peux aller lire le cours d'Orange sur les bases du CSS.

Pour le reste, tout est écrit dans mon message Wink

Je ne t'aiderai pas davantage tant que tu ne m'auras pas montré que tu as tenté quelque chose. Fondamentalement, c'est très simple à faire, il suffit d'essayer, et d'observer.

Par exemple, j'ai bien parlé de la classe .fondbascategorie à renommer dans le CSS... ne contient-elle pas DEJA le lien d'une image ?

Bonsoir,

Malgré notre précédente relance, ce sujet demeure sans réponse. Je me permets donc, comme indiqué, de l'archiver. Si malgré tout ton problème n'était pas résolu, il faudra ouvrir un nouveau sujet. Smile

Merci de ta compréhension. Modification des Templates, effet catégorie [EN COURS] 510527

Modification des Templates, effet catégorie [EN COURS]

Modification des Templates, effet catégorie [EN COURS]

Sujets similaires

Sujets similaires

Partenaires Or