Image en arrière-plan dans les post

2 participants

Forum gratuit : Le forum des forums actifs :: Entraide & Support... :: Problème avec un script, un code :: Archives des problèmes avec un code

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

Résolu Image en arrière-plan dans les post

Message par Cenobite Dim 21 Aoû 2016 - 22:55

Détails techniques


Version du forum : phpBB2
Poste occupé : Administrateur
Navigateur(s) concerné(s) : Mozilla Firefox
Personnes concernées par le problème : Tous les utilisateurs
Problème apparu depuis : Aujourd'hui
Lien du forum : (lien masqué, vous devez poster pour le voir)

Description du problème

Erreur de code CSS provenant d'une réponse dans une autre demande d'une cliente. Voici le liens de la demande en question:https://forum.forumactif.com/t386500-image-de-fond-table-rangee-couleur-1-table-rangee-couleur-2-et-surbrillance?highlight=image+background+dans+les+posts
J'ai vérifié le code avec ceci:http://jigsaw.w3.org/css-validator/

Le but étant d'avoir une image en arrière-plan dans le fonds des sujets/post.
N.B.S'il y a un autre code,je suis preneur!
MERCI!


Dernière édition par Cenobite le Jeu 25 Aoû 2016 - 23:25, édité 1 fois
Cenobite

Cenobite
*

Masculin
Messages : 46
Inscrit(e) le : 27/10/2015

http://thezone.forumactif.com
Cenobite a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Image en arrière-plan dans les post

Message par ◦Jay◦ Lun 22 Aoû 2016 - 8:14

Bonjour Cenobite, la demande dans le sujet que vous donnez n'est pas la même que la votre.

Essayez ce code CSS :

Code:
.postbody{background-image:url("URL de votre image");}

Si vous ne souhaitez pas que l'image se répète :

Code:
.postbody{background-image:url("URL de votre image");
background-repeat:no-repeat;}

Bien à vous.
◦Jay◦

◦Jay◦
Membre actif

Masculin
Messages : 4230
Inscrit(e) le : 24/12/2014

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

Résolu Re

Message par Cenobite Mar 23 Aoû 2016 - 11:30

Salut ◦Jay◦
Je sais bien que ma demande n'est pas la même lol
Mais le code comporte une erreur quand-même non?
En tout cas! Revenons à nos moutons.
Ton code fonctionne mais l'image s'affiche ligne
par ligne selon la longeur du texte que l'on écrit.
Serait-il possible d'avoir l'image au complet avant
de commencer à écrire?

Merci!
Cenobite

Cenobite
*

Masculin
Messages : 46
Inscrit(e) le : 27/10/2015

http://thezone.forumactif.com
Cenobite a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Image en arrière-plan dans les post

Message par ◦Jay◦ Mar 23 Aoû 2016 - 14:36

Bonjour, avant que l'on commence à écrire ? scratch Je ne comprends pas votre question, voulez-vous que l'image soit dans l'éditeur ?

Bref, pour que l'image soit entière dans le post même si le texte ne le permet pas, rajoutez un min-height, comme ceci :

Code:
.postbody{background-image:url("URL de votre image");
background-repeat:no-repeat;
min-height:450px !important;}

J'ai mis 450px de hauteur mais vous devrez mettre la hauteur par rapport à celle de votre image.

Cordialement.
◦Jay◦

◦Jay◦
Membre actif

Masculin
Messages : 4230
Inscrit(e) le : 24/12/2014

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

Résolu Re

Message par Cenobite Mer 24 Aoû 2016 - 2:57

Salut ◦Jay◦,
C'est presque ça!
Image en arrière-plan dans les post Test110
C'est dificile à expliquer. Imagine un parchemin,une feuille où même
comme mon exemple ici,l'image d'un cadre et que tu désires écrire
à l'intérieur. Voici un exemple que j'aimerais utiliser:
Image en arrière-plan dans les post Cadre_10
Présentement avec le nouveau code que tu m'as donné,ont vois
bien le cadre mais le texte commence trop près de la marge et
dépasse l'image.

Merci beaucoup pour ton aide en passant!
À+
Cenobite

Cenobite
*

Masculin
Messages : 46
Inscrit(e) le : 27/10/2015

http://thezone.forumactif.com
Cenobite a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Image en arrière-plan dans les post

Message par ◦Jay◦ Mer 24 Aoû 2016 - 8:46

Ha d'accord, vous souhaitez que l'image s'adapte au texte.

Dans un premier temps, il faut couper votre image de fond en 3 parties, la partie du haut, la partie du centre qui va se répéter tout le long du message puis la partie du bas !

Il va falloir aussi toucher aux templates, dans le template viewtopic_body, recherchez

Code:
<!-- END switch_vote_active -->

                  <div class="postbody">

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

                     <!-- BEGIN switch_attachments -->

et remplacez par :

Code:
<!-- END switch_vote_active -->
                                                <div id="haut_post"></div>
                  <div class="postbody">
                                                       
                     <div id="centre_post"><div class="contenu_post">{postrow.displayed.MESSAGE}</div></div>
                                                        <div id="bas_post"></div>
                     <!-- BEGIN switch_attachments -->

Puis maintenant, le code CSS (réglez la hauteur(height) et la largeur(width) à chaque fois :

Pour la partie du haut :

Code:
#haut_post{
height:--px;
width:---px;
background-image: url('url de votre image');
 background-repeat:no-repeat;
}

Pour la partie du message :

Code:
#centre_post{
width:--px;
background-image: url('url de votre image');}

Pour la partie du bas :

Code:
#bas_post{
height:--px;
width:---px;
background-image: url('url de votre image');
background-repeat:no-repeat;}

Enfin, pour que le message soit bien à l'intérieur de l'image, il faudra ajouter un padding comme ceci :

Code:
.contenu_post{padding:20px;}

J'ai mis 20px mais vous pouvez régler à votre convenance.

Bien à vous.

◦Jay◦

◦Jay◦
Membre actif

Masculin
Messages : 4230
Inscrit(e) le : 24/12/2014

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

Résolu Re: Image en arrière-plan dans les post

Message par Cenobite Mer 24 Aoû 2016 - 9:31

Re salut ◦Jay◦,
Petite question stupide probablement mais,le Padding à la fin tu le mets dans le CSS aussi?
Car avec le Padding dans le CSS avec 20px et tout le reste des codes...ça ne fonctionne pas.
Aucune image en arrière plan. Que du texte. Pour faire le test,j'ai mis en petite dimension
(height:100px /width:50px) en haut et en bas. Pour le centre,100px aussi.

Vraiment un gros MERCI pour ton aide! Wink
À+
Cenobite

Cenobite
*

Masculin
Messages : 46
Inscrit(e) le : 27/10/2015

http://thezone.forumactif.com
Cenobite a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Image en arrière-plan dans les post

Message par ◦Jay◦ Mer 24 Aoû 2016 - 9:36

Avez-vous bien modifié et publié le template ?
◦Jay◦

◦Jay◦
Membre actif

Masculin
Messages : 4230
Inscrit(e) le : 24/12/2014

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

Résolu Re: Image en arrière-plan dans les post

Message par ◦Jay◦ Mer 24 Aoû 2016 - 9:36

La hauteur et la largeur doivent être celles de votre image.
◦Jay◦

◦Jay◦
Membre actif

Masculin
Messages : 4230
Inscrit(e) le : 24/12/2014

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

Résolu Re: Image en arrière-plan dans les post

Message par ◦Jay◦ Mer 24 Aoû 2016 - 9:39

Mais cela fonctionne, résultat de test ici > http://forumtestjay.forumactif.org/t7-testtesttest#32 le cadre jaune pour l'essai. Wink
◦Jay◦

◦Jay◦
Membre actif

Masculin
Messages : 4230
Inscrit(e) le : 24/12/2014

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

Résolu Re

Message par Cenobite Mer 24 Aoû 2016 - 10:12

Re salut,
Oui j'avais bien modifié et publié t'inquiète! Wink
Comment et ou je fait pour trouver la hauteur et la largeur stp?
Merci!
À+
Cenobite

Cenobite
*

Masculin
Messages : 46
Inscrit(e) le : 27/10/2015

http://thezone.forumactif.com
Cenobite a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Image en arrière-plan dans les post

Message par ◦Jay◦ Mer 24 Aoû 2016 - 11:48

Et bien c'est la hauteur et largeur de votre image, il suffit de regarder combien elles font. Avez-vous coupé votre image en trois ?
◦Jay◦

◦Jay◦
Membre actif

Masculin
Messages : 4230
Inscrit(e) le : 24/12/2014

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

Résolu Re

Message par Cenobite Mer 24 Aoû 2016 - 21:05

Re salut Jay,
Hé bien...même après avoir découpé l'image en 3,
j'ai toujours pas d'image en fond de texte.
Voici mon CSS:
Code:
.bodyline {
background-color: #00000;
border: 4px dotted #0598e4;
box-shadow: inset 1px 1px 15px #5a94df;
border-radius: 50px;
padding-left: 50px;
padding-right: 50px;
}
.forumline {
background-color: #00000;
border: 1px dashed #0598e4;
box-shadow: inset 1px 1px 15px #5a94df;
border-radius: 15px;
padding: 10px;
}
 Pour la partie du haut : 
#haut_post{
height:745px;
width:68px;
background-image: url('http://i35.servimg.com/u/f35/19/23/06/82/haut_d10.png');
background-repeat:no-repeat;
}
Pour la partie du message :
#centre_post{
width:359px;
background-image: url('http://i35.servimg.com/u/f35/19/23/06/82/centre10.png');
}
Pour la partie du bas :
#bas_post{
height:745px;
width:44px;
background-image: url('http://i35.servimg.com/u/f35/19/23/06/82/bas_du10.png');
background-repeat:no-repeat;}

.contenu_post{padding:20px;}
Et mon 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(){

    if(typeof(_atc) == "undefined") {
        _atc = { };
    }
   
    _atc.cwait = 0;
    $('.addthis_button').mouseup(function(){
        if ($('#at15s').css('display') == 'block') {
            addthis_close();
        }
    });
});

var hiddenMsgLabel = { visible:'{JS_HIDE_HIDDEN_MESSAGE}', hidden:'{JS_SHOW_HIDDEN_MESSAGE}' };
showHiddenMessage = function(id)
{
    try
    {
        var regId = parseInt(id, 10);
        if( isNaN(regId) ) { regId = 0; }
       
        if( regId > 0)
        {
            $('.post--' + id).toggle(0, function()
         {
            if( $(this).is(":visible") )
            {
               $('#hidden-title--' + id).html(hiddenMsgLabel.visible);
            }
            else
            {
               $('#hidden-title--' + id).html(hiddenMsgLabel.hidden);
            }
         });
        }
    }
    catch(e) { }
   
   return false;
};

//]]>
</script>

<table width="100%" border="0" cellspacing="2" cellpadding="0">
   <tr>
      <td align="left" valign="middle" nowrap="nowrap">
         <span class="nav">
         <!-- BEGIN switch_user_authpost -->
         <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>&nbsp;&nbsp;&nbsp;
         <!-- END switch_user_authpost -->
         <!-- BEGIN switch_user_authreply -->
         <a href="{U_POST_REPLY_TOPIC}"><img src="{REPLY_IMG}" id="i_reply" alt="{L_POST_REPLY_TOPIC}" align="middle" border="0" /></a>
         <!-- END switch_user_authreply -->
         </span>
      </td>      
      <td class="nav" valign="middle" width="100%">
         <span class="nav" itemscope itemtype="http://data-vocabulary.org/Breadcrumb">
                <a class="nav" href="{U_INDEX}" itemprop="url"><span itemprop="title">{L_INDEX}</span></a>
                <!--{NAV_SEP}<a class="nav" href="{U_ALBUM}" itemprop="url"><span itemprop="title">{L_ALBUM}</span></a>-->
                {NAV_CAT_DESC_SECOND}
            </span>
      </td>      
      <td align="right" valign="bottom" nowrap="nowrap" width="100%">
         <!-- BEGIN switch_twitter_btn -->
         <span id="twitter_btn" style="margin-left: 6px; ">
                <a href="https://twitter.com/share" class="twitter-share-button" data-via="{TWITTER}">Tweet</a>
                <script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+'://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js,fjs);}}(document, 'script', 'twitter-wjs');</script>
         </span>
         <!-- END switch_twitter_btn -->
         
         <!-- BEGIN switch_fb_likebtn -->         
         <script>(function(d, s, id) {
           var js, fjs = d.getElementsByTagName(s)[0];
           if (d.getElementById(id)) return;
           js = d.createElement(s); js.id = id;
           js.src = "//connect.facebook.net/{LANGUAGE}/all.js#xfbml=1";
           fjs.parentNode.insertBefore(js, fjs);
         }(document, 'script', 'facebook-jssdk'));</script>   
         <div class="fb-like" data-href="{FORUM_URL}{TOPIC_URL}" data-layout="button_count" data-action="like" data-show-faces="false" data-share="false"></div>
         <!-- END switch_fb_likebtn -->
         
         <span class="gensmall bold">
            <a class="addthis_button" href="http://www.addthis.com/bookmark.php?v=250&amp;pub=forumotion">{L_SHARE}</a>
            <!-- BEGIN switch_plus_menu -->
            &nbsp;|&nbsp;
            <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}&amp;t={TOPIC_ID}','{JS_SESSION_ID}', {JS_AUTH_FAVOURITES});
            //]]>
            </script>
            <!-- END switch_plus_menu -->
         </span>
      </td>
   </tr>
</table>

<table class="forumline" width="100%" border="0" cellspacing="1" cellpadding="0" >
   <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">&nbsp;</td>
               <td align="center" class="t-title">
                  <h1 class="cattitle">&nbsp;{TOPIC_TITLE}</h1>
               </td>
               <td align="right" width="9%" class="browse-arrows"><a href="{U_VIEW_OLDER_TOPIC}">{L_VIEW_PREVIOUS_TOPIC}</a>&nbsp;<a href="{U_VIEW_NEWER_TOPIC}">{L_VIEW_NEXT_TOPIC}</a>&nbsp;<a href="#bottom">{L_GOTO_DOWN}</a>&nbsp;</td>
            </tr>
         </table>
      </td>
   </tr>
   <!-- BEGIN topicpagination -->
   <tr>
      <td class="row1 pagination" colspan="2" align="right" valign="top"><span class="gensmall">{PAGINATION}</span></td>
   </tr>
   <!-- END topicpagination -->
   {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>
   <!-- BEGIN postrow -->
   <!-- BEGIN hidden -->
   <tr>
      <td class="postdetails {postrow.hidden.ROW_CLASS}" colspan="3" align="center">{postrow.hidden.MESSAGE}</td>
   </tr>
   <!-- END hidden -->
   <!-- BEGIN displayed -->
   <tr class="post post--{postrow.displayed.U_POST_ID}" id="p{postrow.displayed.U_POST_ID}" style="{postrow.displayed.DISPLAYABLE_STATE}">
                    <td class="{postrow.displayed.ROW_CLASS}"{postrow.displayed.THANK_BGCOLOR} valign="top" width="150">
                        <div class="post_profile"><span class="name"><a name="{postrow.displayed.U_POST_ID}"></a><strong>{postrow.displayed.POSTER_NAME}</strong></span><br />
                    <span class="postdetails poster-profile">
                    {postrow.displayed.POSTER_RANK}<br />
                    {postrow.displayed.RANK_IMAGE}{postrow.displayed.POSTER_AVATAR}<br /><br />
                    <!-- BEGIN profile_field -->
                    {postrow.displayed.profile_field.LABEL} {postrow.displayed.profile_field.CONTENT}{postrow.displayed.profile_field.SEPARATOR}
                    <!-- END profile_field -->
                    {postrow.displayed.POSTER_RPG}
                </span></div>
                <img src="http://2img.net/i/fa/empty.gif" alt="" style="width:150px;height:1px" />
                          {postrow.displayed.PROFILE_IMG} {postrow.displayed.PM_IMG} {postrow.displayed.EMAIL_IMG}<!-- BEGIN contact_field --> {postrow.displayed.contact_field.CONTENT}<!-- END contact_field --> {postrow.displayed.ONLINE_IMG}
                   
              </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}&nbsp; &nbsp;<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">
                  <!-- BEGIN switch_vote_active -->
                  <div class="vote gensmall">
                     <!-- BEGIN switch_vote -->
                     <div class="vote-button"><a href="{postrow.displayed.switch_vote_active.switch_vote.U_VOTE_PLUS}">+</a></div>
                     <!-- END switch_vote -->

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

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

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

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

                  <div id="haut_post"></div>
                  <div class="postbody">
                                                       
                    <div id="centre_post"><div class="contenu_post">{postrow.displayed.MESSAGE}</div></div>
                                                        <div id="bas_post"></div>

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

                                 <!-- BEGIN switch_dl_att -->
                                 <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}
                                 <!-- END switch_dl_att -->

                                 <!-- BEGIN switch_no_dl_att -->
                                 {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}
                                 <!-- END switch_no_dl_att -->
                              </dt>

                              <!-- BEGIN switch_no_comment -->
                              <dd>
                                 <em>{postrow.displayed.switch_attachments.switch_post_attachments.switch_no_comment.ATTACHMENT_COMMENT}</em>
                              </dd>
                              <!-- END switch_no_comment -->

                              <!-- BEGIN switch_no_dl_att -->
                              <dd>
                                 <em><strong>{postrow.displayed.switch_attachments.switch_post_attachments.switch_no_dl_att.TEXT_NO_DL}</strong></em>
                              </dd>
                              <!-- END switch_no_dl_att -->

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

                     <div class="clear"></div>
                     <!-- BEGIN switch_signature -->
                     <div class="signature_div">
                        {postrow.displayed.SIGNATURE}
                     </div>
                     <!-- END switch_signature -->

                  </div>
                  <span class="gensmall">{postrow.displayed.EDITED_MESSAGE}</span>
               </td>
            </tr>
         </table>
      </td>
   <tr>
      <td class="{postrow.displayed.ROW_CLASS} browse-arrows"{postrow.displayed.THANK_BGCOLOR} colspan="3" align="center" valign="middle" width="100%">
        <a href="#top">{L_BACK_TO_TOP}</a> <a href="#bottom">{L_GOTO_DOWN}</a>
      </td>
  </tr>
   <!-- BEGIN first_post_br -->
</table>
<hr />
<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>
   <!-- END first_post_br -->
   <!-- END displayed -->
   <!-- END postrow -->
   <!-- BEGIN no_post -->
   <tr align="center">
      <td class="row1" colspan="3" height="28">
         <span class="genmed">{no_post.L_NO_POST}</span>
      </td>
   </tr>
   <!-- END no_post -->
   <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">&nbsp;</td>
               <td align="center" class="t-title"><a name="bottomtitle"></a><div class="cattitle">{TOPIC_TITLE}</div></td>
               <td align="right" nowrap="nowrap" width="9%" class="browse-arrows"><a href="{U_VIEW_OLDER_TOPIC}">{L_VIEW_PREVIOUS_TOPIC}</a>&nbsp;<a href="{U_VIEW_NEWER_TOPIC}">{L_VIEW_NEXT_TOPIC}</a>&nbsp;<a href="#top">{L_BACK_TO_TOP}</a>&nbsp;</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>
      <!-- BEGIN topicpagination -->
      <td class="row1" align="right" valign="top" ><span class="gensmall">{PAGINATION}</span></td>
      <!-- END topicpagination -->
   </tr>
   <!-- BEGIN switch_user_logged_in -->
   <!-- BEGIN watchtopic -->
   <tr>
      <td class="row2" colspan="2" align="right" valign="top"><span class="gensmall">{S_WATCH_TOPIC}</span></td>
   </tr>
   <!-- END watchtopic -->
   <!-- END switch_user_logged_in -->
</table>

<!-- BEGIN promot_trafic -->
<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"><div class="cattitle">&nbsp;{PROMOT_TRAFIC_TITLE}</div></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"><div class="cattitle">&nbsp;{PROMOT_TRAFIC_TITLE}</div></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">
         <!-- BEGIN link -->
         »&nbsp;<a style="text-decoration:none" href="{promot_trafic.link.U_HREF}" target="_blank" title="{promot_trafic.link.TITLE}" rel="nofollow">{promot_trafic.link.TITLE}</a><br />
         <!-- END link -->
      </td>
   </tr>
</table>
<!-- END promot_trafic -->

<!-- BEGIN switch_forum_rules -->
<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">
                        <div class="cattitle">&nbsp;{L_FORUM_RULES}</div>
                     </td>
                  </tr>
               </tbody>
            </table>
         </td>
      </tr>
      <tr>
         <td class="row1 clearfix">
            <table>
               <tr>
                  <!-- BEGIN switch_forum_rule_image -->
                  <td class="logo">
                     <img src="{RULE_IMG_URL}" alt="" />
                  </td>
                  <!-- END switch_forum_rule_image -->
                  <td class="rules postbody">
                     {RULE_MSG}
                  </td>
               </tr>
            </table>
         </td>
      </tr>
   </tbody>
</table>
<!-- END switch_forum_rules -->

<table class="forumline noprint" width="100%" border="0" cellspacing="0" cellpadding="0">
   <tr>
      <td class="row2" colspan="2" align="center" style="padding:0px">
         <!-- BEGIN switch_user_logged_in -->
         <a name="quickreply"></a>
         {QUICK_REPLY_FORM}<br />
         <!-- END switch_user_logged_in -->
      </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>
      <!-- BEGIN show_permissions -->
      <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>
      <!-- END show_permissions -->
      <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>
                  <!-- BEGIN show_permissions -->
                  <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>
                  <!-- END show_permissions -->
               </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">
            <!-- BEGIN switch_user_authpost -->
            <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>&nbsp;&nbsp;&nbsp;
            <!-- END switch_user_authpost -->
            <!-- BEGIN switch_user_authreply -->
            <a href="{U_POST_REPLY_TOPIC}"><img src="{REPLY_IMG}" alt="{L_POST_REPLY_TOPIC}" align="middle" border="0" /></a>
            <!-- END switch_user_authreply -->
         </span>
      </td>

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

      <!-- BEGIN moderation_panel -->
      <td align="center">
         <span class="gensmall">{moderation_panel.U_YOUR_PERSONAL_MODERATE}</span>
      </td>
      <td align="center" width="250">
         <span class="gensmall">&nbsp;</span>
      </td>
      <!-- END moderation_panel -->
   </tr>
</table>
</form>

<!-- BEGIN viewtopic_bottom -->
<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="sid" value="{S_SID}" /> -->
            <input type="hidden" name="{SECURE_ID_NAME}" value="{SECURE_ID_VALUE}" />

            <span class="gen">{L_MOD_TOOLS}<br />{S_SELECT_MOD}&nbsp;<input class="liteoption" type="submit" value="{L_GO}" /></span>
         </form>
      </td>
   </tr>
</table>
<!-- END viewtopic_bottom -->

<!-- BEGIN switch_image_resize -->
<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>
<!-- END switch_image_resize -->
<script src="{JS_DIR}addthis/addthis_widget.js" type="text/javascript"></script>
Tu peux voir que j'ai bien remplacé le code en ligne 194.
C'est bizarre puisque toi ça fonctionne en test.
Je vois le cadre juste avec le premier code que tu m'avais
donné au départ.

Merci et à+
Cenobite

Cenobite
*

Masculin
Messages : 46
Inscrit(e) le : 27/10/2015

http://thezone.forumactif.com
Cenobite a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Image en arrière-plan dans les post

Message par ◦Jay◦ Jeu 25 Aoû 2016 - 9:50

Oui, vous faites quelques erreurs dans le css, vos images sont mal coupées de plus, lorsque vous mettez une légende, il faut l'écrire comme ceci : /*Parie haute des messages*/, il faut toujours mettre /* au début d'une phrase si ce n'est pas un code puis la terminer par */ ! Mettez-le CSS ainsi :

Code:

.bodyline {
background-color: #00000;
border: 4px dotted #0598e4;
box-shadow: inset 1px 1px 15px #5a94df;
border-radius: 50px;
padding-left: 50px;
padding-right: 50px;
}
.forumline {
background-color: #00000;
border: 1px dashed #0598e4;
box-shadow: inset 1px 1px 15px #5a94df;
border-radius: 15px;
padding: 10px;
}
/*Parie haute des messages*/
#haut_post{
height:40px;
width:742px;
background-image: url('http://image.noelshack.com/fichiers/2016/34/1472110733-1a.png');
background-repeat:no-repeat;
}
/*Parie centre des messages*/
#centre_post{
width:742px;
background-image: url('http://image.noelshack.com/fichiers/2016/34/1472110741-1b.png');
}
/*Parie basse des messages*/
#bas_post{
height:40px;
width:742px;
background-image: url('http://image.noelshack.com/fichiers/2016/34/1472110746-1c.png');
background-repeat:no-repeat;}
/*contenu messages */
.contenu_post{padding:10px;}

Résultat de test > ici.

Bien à vous.
◦Jay◦

◦Jay◦
Membre actif

Masculin
Messages : 4230
Inscrit(e) le : 24/12/2014

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

Résolu Re

Message par Cenobite Jeu 25 Aoû 2016 - 10:23

Re salut Jay,
YES!!! T'es Génial Jay!
Un gros MERCI pour ta patience Wink

Juste une petite question avant de mettre résolu.
J'ai arrondis les coins du cadre du forum et j'aimerais
les avoir en engle coupé comme on viens de faire.
Est-ce que tu sais le faire? Et si oui,est ce qu'on
peux le faire ici ou s'il faut absolument que je fasse
un nouveau post?

N.B.Ce sont les 2 premiers (bodyline et forumline) en haut du CSS.

Encore MERCI et à+
Cenobite

Cenobite
*

Masculin
Messages : 46
Inscrit(e) le : 27/10/2015

http://thezone.forumactif.com
Cenobite a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Image en arrière-plan dans les post

Message par ◦Jay◦ Jeu 25 Aoû 2016 - 16:50

Bonjour,

Il faudra le faire aussi avec une image, il faut ouvrir un nouveau sujet avec un titre explicite.

Mais c'est tout à fait possible, comme ici. Wink

Cordialement.

◦Jay◦

◦Jay◦
Membre actif

Masculin
Messages : 4230
Inscrit(e) le : 24/12/2014

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

Résolu Re

Message par Cenobite Jeu 25 Aoû 2016 - 23:24

Re Salut Jay,
D'accord alors!
À tout de suite!

MERCI!
Cenobite

Cenobite
*

Masculin
Messages : 46
Inscrit(e) le : 27/10/2015

http://thezone.forumactif.com
Cenobite a été remercié(e) par l'auteur de ce sujet.

Voir le sujet précédent Voir le sujet suivant Revenir en haut

- Sujets similaires

Forum gratuit : Le forum des forums actifs :: Entraide & Support... :: Problème avec un script, un code :: Archives des problèmes avec un code

Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum