Image des catégories en décalage par rapport au cadre

par chocobook Mer 25 Avr 2018 - 8:37

Détails techniques

Version du forum : phpBB2
Poste occupé : Fondateur
Navigateur(s) concerné(s) : Mozilla Firefox
Capture d'écran du problème :

Voir l'image:

Personnes concernées par le problème : Moi uniquement
Problème apparu depuis : 25/04/2018
Lien du forum : http://passionlecture.forumactif.com/

Description du problème

Bonjour,
J'ai un souci avec mes images des catégories, elles sont un peu en décalage par rapport au cadre, j'aimerai quelle soit bien dedans. Pourriez-vous m'aider ? Il n'y avait rien pourtant hier.
Bonne journée et merci d'avance.
Cordialement,
Christelle

par chocobook Jeu 26 Avr 2018 - 7:31

Hello quelqu'un peut-il m'aider ?
Merci.

par **Lixyr** Jeu 26 Avr 2018 - 11:09

Image des catégories en décalage par rapport au cadre 9Wrx4p4

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

Bonjour,

Vous avez deux cellules différentes. En l'état actuel vous ne pouvez pas faire ce que vous voulez. Pouvez-vous nous donner le contenu du template index_box ?

par chocobook Jeu 26 Avr 2018 - 11:17

Bonjour,
voici le contenu de la template

Code:: <table width="100%" border="0" cellspacing="0" cellpadding="0" align="center"> <tr> <td> <div class="nav"><span style="font-style:normal !important; margin-left:-0px !important;" class="link-index"><a class="gensmall" href="{U_INDEX}">{L_INDEX}</a></span><span class="supprimg">{NAV_CAT_DESC}</span></div> </td> <td class="gensmall" align="right">  <span class="link-index"><a class="gensmall" href="{U_SEARCH_NEW}">nouveaux messages</a></span> <span class="link-index"><a class="gensmall" href="{U_SEARCH_SELF}">ses messages</a></span>  <span class="link-index"><a class="gensmall" href="{U_SEARCH_UNANSWERED}">sans réponses</a></span> </td> </tr> </table>   <table class="catfond1" width="100%" border="0" cellspacing="0" cellpadding="0"> <tr><td> </td></tr> </table> <table class="catfond2" width="100%" border="0" cellspacing="0" cellpadding="0"> <tr> <td> <table class="fcat_titre" width="100%" cellspacing="0" cellpadding="0" border="0"> <tr> <td> <table width="100%" border="0" cellspacing="0" cellpadding="0"> <tr> <td width="100%" align="left" class="secondarytitle1"> {catrow.tablehead.L_FORUM} </td> </tr> </table> </td> </tr> </table> <table width="100%" cellspacing="0" cellpadding="0" border="0"> <tr> <td align="center">   <table cellspacing="0" cellpadding="0" class="forumcat" border="0"> <tr> <td> <table width="100%" height="116" border="0" cellspacing="0" cellpadding="0"> <tr> <td width="176"> <div class="bg-desc"></div> <div class="sf"><img class="sfbtn" src="https://2img.net/r/hpimg11/pics/20091341sf.png" /> <div> <table style="padding: 10;" background="https://2img.net/r/hpimg11/pics/285095sfbg.png" align="right" height="75px" width="610" border="0"> <tr> <td valign="top">{catrow.forumrow.L_LINKS}{catrow.forumrow.LINKS}</td> </tr> </table> </div></div> </td> <td width="100%" style="padding-left:15px;" valign="top"> <table width="100%" border="0" cellspacing="0" cellpadding="0"> <tr> <td><a href="{catrow.forumrow.U_VIEWFORUM}"><span class="link-titre">{catrow.forumrow.FORUM_NAME}</span></a></td> </tr> <tr> <td width="100%" valign="top"> <div class="description"><span class="genmed">{catrow.forumrow.FORUM_DESC}</span></div> </td> </tr> <tr> <td width="100%" valign="middle" align="right"> <span id="dernierPoste" class="dernierPoste">{catrow.forumrow.LAST_POST}</span><span id="dernierPoste1" class="gensmall">{catrow.forumrow.POSTS} Messages dans {catrow.forumrow.TOPICS} Sujets</span> <script type="text/javascript">jQuery('#dernierPoste').html(jQuery('#dernierPoste').html().replace(/<br>/g,'<span style="display: inline-block; padding: 0 2px;"> - </span>')).removeAttr('id');</script> </td> </tr> </table> </td> <td width="64" valign="top"> <img title="{catrow.forumrow.L_FORUM_FOLDER_ALT}" src="{catrow.forumrow.FORUM_FOLDER_IMG}" alt="{catrow.forumrow.L_FORUM_FOLDER_ALT}" /> </td> </tr> </table> </td> </tr> </table> <div style="height: 16px;"></div>   </td> </tr> </table> </td> </tr> </table> <table class="catfond3" width="100%" border="0" cellspacing="0" cellpadding="0"> <tr> <td> </td> </tr> </table>

par chocobook Ven 27 Avr 2018 - 7:36

Bonjour,
Je dois faire quoi ensuite ?

par chocobook Sam 28 Avr 2018 - 11:42

Bonjour que dois je faire ensuite ?

par **Lixyr** Sam 28 Avr 2018 - 21:34

Bonsoir,

Alooooors il va falloir tricher pour éviter de casser tout le code (ou tout refaire).

Donc finalement pas besoin de template, on va juste toucher au CSS :

- pour la classe .img-descr, modifier la valeur de "margin-left par "-197px" ;
- pour la classe .description, rajoutez

margin-left: -17px;
padding-left: 17px;

et modifiez la valeur de width par 102%.

par chocobook Dim 29 Avr 2018 - 10:11

Bonjour, merci pour votre aide, il faut que je cherche les bonnes valeurs. Je vous tiens au courant.
Bon dimanche.

par **Lixyr** Dim 29 Avr 2018 - 12:07

Bonjour,

Il suffit de prendre la classe, de faire "rechercher", et d'ensuite trouver la bonne ligne dans cette classe. Les valeurs vous les avez déjà dans votre CSS, il suffit de modifier celles que je vous indique par celles que je vous donne. Wink

par chocobook Dim 29 Avr 2018 - 13:35

Bonjour,
C'est ce que je fais une pause car je m'énerve un peu je n'y arrive pas.
Merci pour votre patience sunny

par **Lixyr** Dim 29 Avr 2018 - 23:59

Bonsoir,

Dans ce cas donnez-moi votre CSS en entier, je vais le faire.

par chocobook Lun 30 Avr 2018 - 8:03

Bonjour,
merci beaucoup.
Voici le code :

Code:: /*--- Topic --- */ .lastpost-avatar img{width: 55px;height: 55px;border-radius: 99px;} .newicon{position: absolute;z-index: 10;margin-left: -80px;margin-top: 5px;} .bloc_sujets{background: rgba(0, 0, 0, 0.8);border-top: solid 5px rgba(255, 255, 255, 0.3);border-bottom: solid 5px rgba(255, 255, 255, 0.3);border-left: solid 5px rgba(255, 255, 255, 0.3);border-right: solid 5px rgba(255, 255, 255, 0.3);margin-bottom:10px;margin-top:10px;} .sujets{background: rgba(255, 255, 255, 0.1);padding: 3px; margin: 8px;-webkit-transition: all .6s ease-in;-moz-transition: all .6s ease-in;-o-transition: all .6s ease-in;transition: all .6s ease-in;text-decoration: none !important;} .sujets:hover{background: rgba(255, 255, 255, 0.2);box-shadow: 0px 0px 50px #000000;z-index: 2;-webkit-transition: all .6s ease-in;-webkit-transform: scale(1.0);-ms-transition: all .6s ease-in;-ms-transform: scale(1.0);-moz-transition: all .6s ease-in;-moz-transform: scale(1.0);transition: all .6s ease-in;transform: scale(1.0);} .sujet_last{display: block;width: 180px;height: 40px;list-style: 40px;background: rgba(255, 255, 255, 0.1);border-left: 2px solid #666;border-right: 2px solid #666;padding-top: 10px;font-size: 11px;} .topictitle{font-variant: small-caps;font-size: 12px;} .sujets_auteur{display: block;width: 200px;font-size: 11px;} .sujets_stats{width: 880px;text-align: right;margin-bottom: 5px;} .sujets_stats_contenu{font-size: 10px;color: #666;} /*--- PA --- */ .pa{padding-left: 10px;padding-right: 10px;} .pa h1{text-align: center;background-color: rgba(0, 0, 0, 0.3) !important;margin-left: 5px;margin-right: 5px;margin-bottom: 5px;height: 25px;line-height: 25px;text-transform: uppercase;font-size: 10px;font-family: 'Montserrat', sans-serif;} .pa div{padding: 5px;} .navi{display: block;background-color: rgba(0, 0, 0, 0.8) !important;padding: 4px;margin-bottom: 3px;border: 2px solid rgba(255, 255, 255, 0.3) !important;} .annonce{overflow: auto;height: 190px; margin-top: -4px;} #newsareal1 div.topictitle {display: block !important;padding: 0px 5px 0px 20px;height: 28px;line-height: 28px;background-color: rgba(0, 0, 0, 0.3) !important; font-size: 11px;overflow:hidden !important;} #newsareal1 div.topictitle a {color: #8a8383 !important;text-decoration: none !important;font-size: 11px !important;font-style: normal !important;font-weight: normal !important;} #newsareal1 div.topictitle img {display:none;} /*--- Formulaire --- */ input.post,textarea.post,select,#text_editor_iframe,textarea.inputbox{padding: 3px;background-color: #341b2e !important;border: solid 2px #ffffff;} input.mainoption {padding: 5px;background-color : #ffffff;font-weight : bold;border: solid 2px #ffffff;} input.liteoption {padding: 5px;background-color : #ffffff;font-weight : normal;border: solid 2px #ffffff;} input,textarea, select, #text_editor_iframe {color : #ebebeb;font: normal 11px Montserrat,sans-serif;border-color: #f8efe2;border: solid 2px;} input{background-color: #341b2e !important;} /*--- Code, Quote, Spoiler --- */ .code{font-family: Montserrat,sans-serif;font-size: 11px;padding: 8px;color: #ffffff;border: 3px solid #252525 !important;background-color: #ffffff!important;} .code div.cont_code {max-height:200px;overflow:auto;} .quote{font-family: Montserrat,sans-serif;font-size: 11px;padding: 8px;color: #ffffff;line-height: 125%;border: 3px solid #252525 !important;background-color: #000000 !important;} .spoiler_closed {display:block;font-family: Montserrat,sans-serif;font-size: 11px;color: #444444;line-height: 125%;border: 3px solid #252525 !important;background-color: #000000 !important;} .spoiler_closed.hidden {display:none;} .spoiler_content {padding: 8px;display:block;font-family: Montserrat,sans-serif;font-size: 11px;color: #444444;line-height: 125%;border: 3px solid #252525 !important;background-color: #000000 !important;} .spoiler_content.hidden {display:none;} /*--- Fiche Pres --- */ .fdpbtn{display: inline-block;margin-left: -1px;margin-right: 6px;margin-top: 8px;padding:5px;color: #fff;background-color: #252525 !important;border: solid 2px rgba(255, 255, 255, 0.3) !important;-webkit-border-radius: 2px 2px 2px 2px;border-radius: 2px 2px 2px 2px;-webkit-transition: all .6s ease-in;-moz-transition: all .6s ease-in;-o-transition: all .6s ease-in;transition: all .6s ease-in;} .fdpbtn:hover{color: #fff;opacity: 0.3;} .fp1{margin: auto;margin-bottom: 4px; width: 650px;height: 25px;line-height: 25px;font-family: 'Lobster', cursive;font-size: 20px;color: #1faded;border-bottom: 1px solid #666;} .fp2{margin: auto; width: 650px;} .fp3{width: 150px;height: 150px;overflow: hidden;border: 5px solid rgba(255, 255, 255, 0.1);} .fpdiv{margin-bottom: 8px;margin-left: 12px;font-size: 12px !important;font-family: 'Montserrat', sans-serif;} .fpspan{margin-right: 10px;padding: 6px 10px 5px 10px;text-transform: uppercase;font-size: 10px !important;font-family: 'Montserrat', sans-serif;color: #fff;background-color: rgba(0,0,0,0.6);} /*--- Corp du forum --- */ body{margin: 0;padding: 0;background-image: url("https://i62.servimg.com/u/f62/19/75/57/75/f10.jpg");background-position: center top;background-repeat: no-repeat;background-attachment: fixed;background-color: #1f1919;} .bodyline{background-color: transparent;border: 0px solid;padding:0;} .bodylinewidth{width:910px;} .forumline{background: rgba(0, 0, 0, 0.8);border-top: solid 5px rgba(255, 255, 255, 0.3);border-bottom: solid 5px rgba(255, 255, 255, 0.3);border-left: solid 5px rgba(255, 255, 255, 0.3);border-right: solid 5px rgba(255, 255, 255, 0.3);padding:10px;margin-bottom:5px;margin-top:5px;} th {background-color: rgba(255, 255, 255, 0.2);background-image: none;font-weight: normal !important;font-family: 'Montserrat', sans-serif !important;text-transform: uppercase;} td.row1,td.row3.over:hover {background-color: rgba(255, 255, 255, 0.1);} td.row2,td.row1.over:hover {background-color:rgba(255, 255, 255, 0.1);} td.row3{background-color: rgba(255, 255, 255, 0.1);} td.rowpic {background-color: rgba(255, 255, 255, 0.1);css} td.cat,td.catHead,td.catSides,td.catLeft,td.catRight,td.catBottom { background-color: rgba(255, 255, 255, 0.2);background-image: none);height: 28px;} td.cat,td.catHead,td.catSides,td.catLeft,td.catRight,td.catBottom {border: 0;height: 30px; line-height:30px; padding-left:10px; padding-right:10px;} td.cat,td.catHead,td.catBottom {height: 30px;border-width: 0;} th.thHead,th.thSides,th.thTop,th.thLeft,th.thRight,th.thBottom,th.thCornerL,th.thCornerR {border: 0;} a:link{-webkit-transition: all .6s ease-in;-moz-transition: all .6s ease-in;-o-transition: all .6s ease-in;transition: all .6s ease-in;text-decoration: none !important;} a:visited{-webkit-transition: all .6s ease-in;-moz-transition: all .6s ease-in;-o-transition: all .6s ease-in;transition: all .6s ease-in;text-decoration: none !important;} a:active{-webkit-transition: all .6s ease-in;-moz-transition: all .6s ease-in;-o-transition: all .6s ease-in;transition: all .6s ease-in;text-decoration: none !important;} a:hover{text-decoration: none !important;} /*--- Fonts --- */ @import url('https://fonts.googleapis.com/css?family=Lobster'); @import url('https://fonts.googleapis.com/css?family=Montserrat'); /*--- Navigation --- */ #menu{position:fixed;z-index: 100;top:0; left:0; width:100%; height:34px;} #menuinner{position: relative;margin: 0 auto;width: 50%;height: 34px;background: rgba(0, 0, 0, 0.8);border-bottom: solid 5px rgba(255, 255, 255, 0.3);border-left: solid 5px rgba(255, 255, 255, 0.3);border-right: solid 5px rgba(255, 255, 255, 0.3);text-align: center;} #menuinner a{display: inline-table;height: 34px;line-height: 34px;color:#666;text-decoration:none;-webkit-transition: color .6s ease-in;-moz-transition: color .6s ease-in;-o-transition: color .6s ease-in;transition: color .6s ease-in;text-decoration: none !important;text-transform: uppercase;font-size: 10px;font-family: 'Montserrat', sans-serif;} #menuinner a:hover{color: rgba(0, 0, 0, 0.8);} #menuinner span{display: inline-table;height: 34px;line-height: 34px;padding-left: 10px;padding-right: 10px;-webkit-transition: background .8s ease-in;-moz-transition: background .8s ease-in;-o-transition: background .8s ease-in;transition: background .8s ease-in;} #menuinner span:hover{background-color: rgba(255, 255, 255, 0.3);} #backtop{position: absolute;top: 6px;right: -14px;width: 50px;height: 50px;background-color: transparent;background-image: url(https://2img.net/r/hpimg11/pics/474837top.png);background-repeat: no-repeat;background-position: center center;} #backtop:hover{cursor:pointer;} /*--- Header --- */ #logo{position: absolute;top: 80px;left: -40px;z-index: 10;width: 236px !important;height: 144px !important;transform:rotate(1deg);-ms-transform:rotate(1deg);-moz-transform:rotate(1deg);-webkit-transform:rotate(1deg);-o-transform:rotate(1deg);} #header{padding-top: 90px;padding-bottom: 20px;width: 910px;height: 300px;transform:rotate(-1deg);-ms-transform:rotate(-1deg);-moz-transform:rotate(-1deg);-webkit-transform:rotate(-1deg);-o-transform:rotate(-1deg);} #header img{width: 910px;height: 300px;} #headercadre{position: absolute;width: 910px;height: 300px;background-image: url("https://2img.net/r/hpimg11/pics/775862cadre.png");} /*--- Qeel --- */ #qeel{margin-top: 30px;padding: 8px;background: rgba(0, 0, 0, 1);border-top: solid 5px #505050;border-left: solid 5px #505050;border-right: solid 5px #505050;} #qeellist li{list-style: none;padding: 0px;padding-left: 8px; padding-bottom: 1px;padding-top: 1px;margin: 0px;font-family: 'Montserrat', sans-serif !important;text-transform: uppercase;color:#666 !important;-webkit-transition: padding .6s ease-in;-moz-transition: padding .6s ease-in;-o-transition: padding .6s ease-in;} #qeellist li:hover{padding-left: 15px;} #qeellist a{display: inline-block;text-decoration: none !important;font-size: 8px !important;color:#666;-webkit-transition: color .6s ease-in;-moz-transition: color .6s ease-in;-o-transition: color .6s ease-in;} #qeellist a:hover{text-decoration: none !important;color: #fff;} .point{width: 6px;height: 6px;padding-right: 4px;} #qeelinfo{border-right: 1px solid #231f1f;} #qeelinfo img{position: absolute;margin-left: -35px;margin-top: -35px;} #qeel1{padding-left: 160px;} #qeelinfo .gensmall{color:#666 !important;font-family: 'Montserrat', sans-serif !important;font-size: 11px !important;} #qeelinfo a, #qeelgroup a{font-family: 'Montserrat', sans-serif !important;font-size: 11px !important; text-decoration: none !important;-webkit-transition: color .6s ease-in;-moz-transition: color .6s ease-in;-o-transition: color .6s ease-in;} #qeelinfo a:hover, #qeelgroup a:hover{text-decoration: none !important;} #qeelgroup{padding: 8px;background: rgba(0, 0, 0, 1);border-left: solid 5px #505050;border-right: solid 5px #505050;} #qeel2{display: inline-table;border-left: 2px solid #231f1f;border-right: 2px solid #231f1f;} /*--- Footer --- */ #page-footer{padding: 8px;background: rgba(0, 0, 0, 1);border-top: solid 5px #505050;border-bottom: solid 5px #505050;border-left: solid 5px #505050;border-right: solid 5px #505050;} #page-footer .gen{font-family: 'Montserrat', sans-serif !important;font-size: 12px !important;} #page-footer a{color: #666;text-decoration: none !important;-webkit-transition: color .6s ease-in;-moz-transition: color .6s ease-in;-o-transition: color .6s ease-in;} #page-footer a:hover{color: #fff;text-decoration: none !important;} /*--- Categorie --- */ .forumcat {width: 100%;} .link-index{margin-top: 4px;margin-bottom: 4px; margin-left: 8px;display: inline-table;height: 26px;line-height: 26px;padding-left: 8px;padding-right: 8px;text-transform: uppercase;font-size: 10px;background-color: rgba(255, 255, 255, 0.3);border: 2px solid rgba(255, 255, 255, 0.1);-webkit-transition: all .6s ease-in;-moz-transition: all .6s ease-in;-o-transition: all .6s ease-in;transition: all .6s ease-in;} .link-index:hover{color: #666;cursor:pointer;background: rgb(0,0,0 0.8);} .link-index a{display: block;font-size: 9px !important;color: rgba(0, 0, 0, 1);font-style: normal !important;font-weight: normal !important;cursor:pointer;} .catfond1{height: 32px;background-position: center bottom;background-repeat: no-repeat;background-image: url("https://2img.net/r/hpimg11/pics/242816catfond1.png");} .catfond2{background-position: center top;background-repeat: repeat-y;background-image: url("https://2img.net/r/hpimg11/pics/395047catfond2.png");} .catfond3{margin-bottom: 4px; height: 32px;background-position: center top;background-repeat: no-repeat;background-image: url("https://2img.net/r/hpimg11/pics/731388catfond3.png");} .fcat_titre{height:20px;line-height:10px;border: 0px solid;margin-bottom: 10px;} .secondarytitle1,.secondarytitle1 h2 {margin-left: 10px;margin-bottom: 8px;font-family: 'Lobster', cursive;text-shadow: 1px 1px 0 #ffffff !important;padding: 0;color: #ffffff;font-size: 20px;font-weight: bold;text-transform: capitalize;} .secondarytitle1 h2{display:inline;} .link-titre{color: #ffffff;font-size: 12px;font-style: normal;font-weight: normal;text-transform: uppercase;-webkit-transition: all .6s ease-in;-moz-transition: all .6s ease-in;-o-transition: all .6s ease-in;transition: all .6s ease-in;} .link-titre:hover{color: #fffff !important; padding:10px;} .description{background-color: rgba(0, 0, 0, 0.2);margin-top: 3px;margin-bottom: 5px;padding: 8px;width:100%; height:70px; overflow:auto;border-radius: 4px 4px 4px 4px;} .dernierPoste{font-size: 11px !important;font-style: normal;color: #5d5d5d !important;display: inline-table !important;padding-left: 17px !important;padding-right: 10px !important;height: 23px !important;line-height: 23px !important;background-color: rgba(0, 0, 0, 0.2) !important;} #dernierPoste1 {margin-left: 10px;color: #5d5d5d !important;display: inline-table;padding-left: 10px;padding-right: 10px;height: 23px;line-height: 23px;background-color: rgba(0, 0, 0, 0.2);} .img-descr{position:absolute;z-index: 10;margin-left: -205px;margin-top: -16px;width:176px;height:116px;background-repeat: no-repeat;background-position: center center;transform:rotate(-2deg);-ms-transform:rotate(-2deg);-moz-transform:rotate(-2deg);-webkit-transform:rotate(-2deg);-o-transform:rotate(-2deg);} .bg-desc{margin-left: 20px;transform:rotate(-2deg);-ms-transform:rotate(-2deg);-moz-transform:rotate(-2deg);-webkit-transform:rotate(-2deg);-o-transform:rotate(-2deg);width:176px;height:116px;background-color: transparent;background-image: url("https://2img.net/r/hpimg11/pics/968440imgdesc1.png");border: 5px #ffffff solid;background-repeat: no-repeat;background-position: center center;} .sf{position: absolute;margin-top: -120px;margin-left: 25px;z-index: 50;width:176px;height:116px;background-color: transparent !important;text-decoration: none !important;transform:rotate(-2deg);-ms-transform:rotate(-2deg);-moz-transform:rotate(-2deg);-webkit-transform:rotate(-2deg);-o-transform:rotate(-2deg);} .sfbtn{position: absolute;margin-left: 17px;margin-top: 86px;width: 90px;transform:rotate(2deg);-ms-transform:rotate(2deg);-moz-transform:rotate(2deg);-webkit-transform:rotate(2deg);-o-transform:rotate(2deg);} .sf:hover {z-index: 50;} .sf div {display: none;} .sf:hover div {display: block;position: absolute;top: 18px;left: 170px;width: 630px;height: 65px;overflow: auto;background-color: transparent;color: #000;text-align: justify;font-weight: none;padding: 10px;transform:rotate(2deg);-ms-transform:rotate(2deg);-moz-transform:rotate(2deg);-webkit-transform:rotate(2deg);-o-transform:rotate(2deg);} #sfbg{background-color: #ff00 !important;} /*--- Profil Message --- */ .namepost{position: relative;top: -10;right: 0px;z-index: 5;padding-right: 10px;letter-spacing: -2px;font-size: 24px;font-weight: bold !important;font-family: 'Lobster', cursive;text-shadow: 5px 5px 5px #000000;} .namepost:first-letter {font-size: 30px;} .rankpost{position: relative;top: -19;right: 0px;z-index: 2;padding-right: 15px;font-size: 12px;font-family: 'Montserrat', sans-serif;text-transform: uppercase;} .contenu_message{padding: 10px;text-align: justify;background-position: center top;background-repeat: repeat-y;background-image: url("https://2img.net/r/hpimg11/pics/395047catfond2.png");} .profil1{height: 32px;background-position: center bottom;background-repeat: no-repeat;background-image: url("https://2img.net/r/hpimg11/pics/929162catfond01.png");} .profil_reel{position: relative;width: 100%;height: 160px;background-image: url("https://2img.net/r/hpimg11/pics/285095sfbg.png");background-repeat: repeat;-webkit-box-shadow: 0 10px 20px -8px rgba(0,0,0,0.6);box-shadow: 0 15px 20px -8px rgba(0,0,0,0.6);} .avatar_reel{width: 150px;height: 150px;overflow: hidden;float: right;border: 5px solid rgba(255, 255, 255, 0.1);} .contactfield {width: 150px;height: 150px;overflow: auto;} .contactfield img{-webkit-transition: all .6s ease-in;-moz-transition: all .6s ease-in;-o-transition: all .6s ease-in;transition: all .6s ease-in;} .contactfield img:hover{opacity: 0.5;} .online_img:empty {position: absolute;z-index: 10;top: 86px;right: -25px;background-image: url(https://2img.net/r/hpimg11/pics/357506off.png);width: 91px;height: 74px;} .online_img {position: absolute;z-index: 15;top: 86px;right: -25px;width: 91px;height: 74px;} .post1, .post2, .post3{text-align: left;font-size: 12px;font-family: 'Montserrat', sans-serif;color: #666;} .post1{padding-left: 8px;padding-right: 8px;padding-top: 6px;padding-bottom: 6px;background-color: rgba(0,0,0, 0.8) !important;} .post3{position: absolute;top: 18px;left: 48px;font-size: 11px;} .pfield{padding: 8px;margin-left: 10px;margin-top: 20px;overflow: auto;width: 100%;height: 98px;background: rgba(0, 0, 0, 0.2);} .pfield1 .label{text-align: left !important;font-size: 12px !important;font-family: 'Montserrat', sans-serif !important;color: #666 !important;} .pfield2{text-align: left !important;font-size: 12px !important;font-family: 'Montserrat', sans-serif !important;color: #c1c1c1 !important;} .btnmodif{background-position: center top;background-repeat: repeat-y;background-image: url("https://2img.net/r/hpimg11/pics/395047catfond2.png");} .messagebloc{padding: 10px;background: rgba(0, 0, 0, 0.2);} .ttopic{width: 100%;height: 30px;line-height: 30px;text-align: left;font-size: 12px;font-family: 'Montserrat', sans-serif;text-transform: uppercase;color: #666;}

par **Lixyr** Lun 30 Avr 2018 - 13:13

Comme ça, ça devrait donner ce que vous souhaitez :

Code:: /*--- Topic --- */ .lastpost-avatar img{width: 55px;height: 55px;border-radius: 99px;} .newicon{position: absolute;z-index: 10;margin-left: -80px;margin-top: 5px;} .bloc_sujets{background: rgba(0, 0, 0, 0.8);border-top: solid 5px rgba(255, 255, 255, 0.3);border-bottom: solid 5px rgba(255, 255, 255, 0.3);border-left: solid 5px rgba(255, 255, 255, 0.3);border-right: solid 5px rgba(255, 255, 255, 0.3);margin-bottom:10px;margin-top:10px;} .sujets{background: rgba(255, 255, 255, 0.1);padding: 3px; margin: 8px;-webkit-transition: all .6s ease-in;-moz-transition: all .6s ease-in;-o-transition: all .6s ease-in;transition: all .6s ease-in;text-decoration: none !important;} .sujets:hover{background: rgba(255, 255, 255, 0.2);box-shadow: 0px 0px 50px #000000;z-index: 2;-webkit-transition: all .6s ease-in;-webkit-transform: scale(1.0);-ms-transition: all .6s ease-in;-ms-transform: scale(1.0);-moz-transition: all .6s ease-in;-moz-transform: scale(1.0);transition: all .6s ease-in;transform: scale(1.0);} .sujet_last{display: block;width: 180px;height: 40px;list-style: 40px;background: rgba(255, 255, 255, 0.1);border-left: 2px solid #666;border-right: 2px solid #666;padding-top: 10px;font-size: 11px;} .topictitle{font-variant: small-caps;font-size: 12px;} .sujets_auteur{display: block;width: 200px;font-size: 11px;} .sujets_stats{width: 880px;text-align: right;margin-bottom: 5px;} .sujets_stats_contenu{font-size: 10px;color: #666;} /*--- PA --- */ .pa{padding-left: 10px;padding-right: 10px;} .pa h1{text-align: center;background-color: rgba(0, 0, 0, 0.3) !important;margin-left: 5px;margin-right: 5px;margin-bottom: 5px;height: 25px;line-height: 25px;text-transform: uppercase;font-size: 10px;font-family: 'Montserrat', sans-serif;} .pa div{padding: 5px;} .navi{display: block;background-color: rgba(0, 0, 0, 0.8) !important;padding: 4px;margin-bottom: 3px;border: 2px solid rgba(255, 255, 255, 0.3) !important;} .annonce{overflow: auto;height: 190px; margin-top: -4px;} #newsareal1 div.topictitle {display: block !important;padding: 0px 5px 0px 20px;height: 28px;line-height: 28px;background-color: rgba(0, 0, 0, 0.3) !important; font-size: 11px;overflow:hidden !important;} #newsareal1 div.topictitle a {color: #8a8383 !important;text-decoration: none !important;font-size: 11px !important;font-style: normal !important;font-weight: normal !important;} #newsareal1 div.topictitle img {display:none;} /*--- Formulaire --- */ input.post,textarea.post,select,#text_editor_iframe,textarea.inputbox{padding: 3px;background-color: #341b2e !important;border: solid 2px #ffffff;} input.mainoption {padding: 5px;background-color : #ffffff;font-weight : bold;border: solid 2px #ffffff;} input.liteoption {padding: 5px;background-color : #ffffff;font-weight : normal;border: solid 2px #ffffff;} input,textarea, select, #text_editor_iframe {color : #ebebeb;font: normal 11px Montserrat,sans-serif;border-color: #f8efe2;border: solid 2px;} input{background-color: #341b2e !important;} /*--- Code, Quote, Spoiler --- */ .code{font-family: Montserrat,sans-serif;font-size: 11px;padding: 8px;color: #ffffff;border: 3px solid #252525 !important;background-color: #ffffff!important;} .code div.cont_code {max-height:200px;overflow:auto;} .quote{font-family: Montserrat,sans-serif;font-size: 11px;padding: 8px;color: #ffffff;line-height: 125%;border: 3px solid #252525 !important;background-color: #000000 !important;} .spoiler_closed {display:block;font-family: Montserrat,sans-serif;font-size: 11px;color: #444444;line-height: 125%;border: 3px solid #252525 !important;background-color: #000000 !important;} .spoiler_closed.hidden {display:none;} .spoiler_content {padding: 8px;display:block;font-family: Montserrat,sans-serif;font-size: 11px;color: #444444;line-height: 125%;border: 3px solid #252525 !important;background-color: #000000 !important;} .spoiler_content.hidden {display:none;} /*--- Fiche Pres --- */ .fdpbtn{display: inline-block;margin-left: -1px;margin-right: 6px;margin-top: 8px;padding:5px;color: #fff;background-color: #252525 !important;border: solid 2px rgba(255, 255, 255, 0.3) !important;-webkit-border-radius: 2px 2px 2px 2px;border-radius: 2px 2px 2px 2px;-webkit-transition: all .6s ease-in;-moz-transition: all .6s ease-in;-o-transition: all .6s ease-in;transition: all .6s ease-in;} .fdpbtn:hover{color: #fff;opacity: 0.3;} .fp1{margin: auto;margin-bottom: 4px; width: 650px;height: 25px;line-height: 25px;font-family: 'Lobster', cursive;font-size: 20px;color: #1faded;border-bottom: 1px solid #666;} .fp2{margin: auto; width: 650px;} .fp3{width: 150px;height: 150px;overflow: hidden;border: 5px solid rgba(255, 255, 255, 0.1);} .fpdiv{margin-bottom: 8px;margin-left: 12px;font-size: 12px !important;font-family: 'Montserrat', sans-serif;} .fpspan{margin-right: 10px;padding: 6px 10px 5px 10px;text-transform: uppercase;font-size: 10px !important;font-family: 'Montserrat', sans-serif;color: #fff;background-color: rgba(0,0,0,0.6);} /*--- Corp du forum --- */ body{margin: 0;padding: 0;background-image: url("https://i62.servimg.com/u/f62/19/75/57/75/f10.jpg");background-position: center top;background-repeat: no-repeat;background-attachment: fixed;background-color: #1f1919;} .bodyline{background-color: transparent;border: 0px solid;padding:0;} .bodylinewidth{width:910px;} .forumline{background: rgba(0, 0, 0, 0.8);border-top: solid 5px rgba(255, 255, 255, 0.3);border-bottom: solid 5px rgba(255, 255, 255, 0.3);border-left: solid 5px rgba(255, 255, 255, 0.3);border-right: solid 5px rgba(255, 255, 255, 0.3);padding:10px;margin-bottom:5px;margin-top:5px;} th {background-color: rgba(255, 255, 255, 0.2);background-image: none;font-weight: normal !important;font-family: 'Montserrat', sans-serif !important;text-transform: uppercase;} td.row1,td.row3.over:hover {background-color: rgba(255, 255, 255, 0.1);} td.row2,td.row1.over:hover {background-color:rgba(255, 255, 255, 0.1);} td.row3{background-color: rgba(255, 255, 255, 0.1);} td.rowpic {background-color: rgba(255, 255, 255, 0.1);css} td.cat,td.catHead,td.catSides,td.catLeft,td.catRight,td.catBottom { background-color: rgba(255, 255, 255, 0.2);background-image: none);height: 28px;} td.cat,td.catHead,td.catSides,td.catLeft,td.catRight,td.catBottom {border: 0;height: 30px; line-height:30px; padding-left:10px; padding-right:10px;} td.cat,td.catHead,td.catBottom {height: 30px;border-width: 0;} th.thHead,th.thSides,th.thTop,th.thLeft,th.thRight,th.thBottom,th.thCornerL,th.thCornerR {border: 0;} a:link{-webkit-transition: all .6s ease-in;-moz-transition: all .6s ease-in;-o-transition: all .6s ease-in;transition: all .6s ease-in;text-decoration: none !important;} a:visited{-webkit-transition: all .6s ease-in;-moz-transition: all .6s ease-in;-o-transition: all .6s ease-in;transition: all .6s ease-in;text-decoration: none !important;} a:active{-webkit-transition: all .6s ease-in;-moz-transition: all .6s ease-in;-o-transition: all .6s ease-in;transition: all .6s ease-in;text-decoration: none !important;} a:hover{text-decoration: none !important;} /*--- Fonts --- */ @import url('https://fonts.googleapis.com/css?family=Lobster'); @import url('https://fonts.googleapis.com/css?family=Montserrat'); /*--- Navigation --- */ #menu{position:fixed;z-index: 100;top:0; left:0; width:100%; height:34px;} #menuinner{position: relative;margin: 0 auto;width: 50%;height: 34px;background: rgba(0, 0, 0, 0.8);border-bottom: solid 5px rgba(255, 255, 255, 0.3);border-left: solid 5px rgba(255, 255, 255, 0.3);border-right: solid 5px rgba(255, 255, 255, 0.3);text-align: center;} #menuinner a{display: inline-table;height: 34px;line-height: 34px;color:#666;text-decoration:none;-webkit-transition: color .6s ease-in;-moz-transition: color .6s ease-in;-o-transition: color .6s ease-in;transition: color .6s ease-in;text-decoration: none !important;text-transform: uppercase;font-size: 10px;font-family: 'Montserrat', sans-serif;} #menuinner a:hover{color: rgba(0, 0, 0, 0.8);} #menuinner span{display: inline-table;height: 34px;line-height: 34px;padding-left: 10px;padding-right: 10px;-webkit-transition: background .8s ease-in;-moz-transition: background .8s ease-in;-o-transition: background .8s ease-in;transition: background .8s ease-in;} #menuinner span:hover{background-color: rgba(255, 255, 255, 0.3);} #backtop{position: absolute;top: 6px;right: -14px;width: 50px;height: 50px;background-color: transparent;background-image: url(https://2img.net/r/hpimg11/pics/474837top.png);background-repeat: no-repeat;background-position: center center;} #backtop:hover{cursor:pointer;} /*--- Header --- */ #logo{position: absolute;top: 80px;left: -40px;z-index: 10;width: 236px !important;height: 144px !important;transform:rotate(1deg);-ms-transform:rotate(1deg);-moz-transform:rotate(1deg);-webkit-transform:rotate(1deg);-o-transform:rotate(1deg);} #header{padding-top: 90px;padding-bottom: 20px;width: 910px;height: 300px;transform:rotate(-1deg);-ms-transform:rotate(-1deg);-moz-transform:rotate(-1deg);-webkit-transform:rotate(-1deg);-o-transform:rotate(-1deg);} #header img{width: 910px;height: 300px;} #headercadre{position: absolute;width: 910px;height: 300px;background-image: url("https://2img.net/r/hpimg11/pics/775862cadre.png");} /*--- Qeel --- */ #qeel{margin-top: 30px;padding: 8px;background: rgba(0, 0, 0, 1);border-top: solid 5px #505050;border-left: solid 5px #505050;border-right: solid 5px #505050;} #qeellist li{list-style: none;padding: 0px;padding-left: 8px; padding-bottom: 1px;padding-top: 1px;margin: 0px;font-family: 'Montserrat', sans-serif !important;text-transform: uppercase;color:#666 !important;-webkit-transition: padding .6s ease-in;-moz-transition: padding .6s ease-in;-o-transition: padding .6s ease-in;} #qeellist li:hover{padding-left: 15px;} #qeellist a{display: inline-block;text-decoration: none !important;font-size: 8px !important;color:#666;-webkit-transition: color .6s ease-in;-moz-transition: color .6s ease-in;-o-transition: color .6s ease-in;} #qeellist a:hover{text-decoration: none !important;color: #fff;} .point{width: 6px;height: 6px;padding-right: 4px;} #qeelinfo{border-right: 1px solid #231f1f;} #qeelinfo img{position: absolute;margin-left: -35px;margin-top: -35px;} #qeel1{padding-left: 160px;} #qeelinfo .gensmall{color:#666 !important;font-family: 'Montserrat', sans-serif !important;font-size: 11px !important;} #qeelinfo a, #qeelgroup a{font-family: 'Montserrat', sans-serif !important;font-size: 11px !important; text-decoration: none !important;-webkit-transition: color .6s ease-in;-moz-transition: color .6s ease-in;-o-transition: color .6s ease-in;} #qeelinfo a:hover, #qeelgroup a:hover{text-decoration: none !important;} #qeelgroup{padding: 8px;background: rgba(0, 0, 0, 1);border-left: solid 5px #505050;border-right: solid 5px #505050;} #qeel2{display: inline-table;border-left: 2px solid #231f1f;border-right: 2px solid #231f1f;} /*--- Footer --- */ #page-footer{padding: 8px;background: rgba(0, 0, 0, 1);border-top: solid 5px #505050;border-bottom: solid 5px #505050;border-left: solid 5px #505050;border-right: solid 5px #505050;} #page-footer .gen{font-family: 'Montserrat', sans-serif !important;font-size: 12px !important;} #page-footer a{color: #666;text-decoration: none !important;-webkit-transition: color .6s ease-in;-moz-transition: color .6s ease-in;-o-transition: color .6s ease-in;} #page-footer a:hover{color: #fff;text-decoration: none !important;} /*--- Categorie --- */ .forumcat {width: 100%;} .link-index{margin-top: 4px;margin-bottom: 4px; margin-left: 8px;display: inline-table;height: 26px;line-height: 26px;padding-left: 8px;padding-right: 8px;text-transform: uppercase;font-size: 10px;background-color: rgba(255, 255, 255, 0.3);border: 2px solid rgba(255, 255, 255, 0.1);-webkit-transition: all .6s ease-in;-moz-transition: all .6s ease-in;-o-transition: all .6s ease-in;transition: all .6s ease-in;} .link-index:hover{color: #666;cursor:pointer;background: rgb(0,0,0 0.8);} .link-index a{display: block;font-size: 9px !important;color: rgba(0, 0, 0, 1);font-style: normal !important;font-weight: normal !important;cursor:pointer;} .catfond1{height: 32px;background-position: center bottom;background-repeat: no-repeat;background-image: url("https://2img.net/r/hpimg11/pics/242816catfond1.png");} .catfond2{background-position: center top;background-repeat: repeat-y;background-image: url("https://2img.net/r/hpimg11/pics/395047catfond2.png");} .catfond3{margin-bottom: 4px; height: 32px;background-position: center top;background-repeat: no-repeat;background-image: url("https://2img.net/r/hpimg11/pics/731388catfond3.png");} .fcat_titre{height:20px;line-height:10px;border: 0px solid;margin-bottom: 10px;} .secondarytitle1,.secondarytitle1 h2 {margin-left: 10px;margin-bottom: 8px;font-family: 'Lobster', cursive;text-shadow: 1px 1px 0 #ffffff !important;padding: 0;color: #ffffff;font-size: 20px;font-weight: bold;text-transform: capitalize;} .secondarytitle1 h2{display:inline;} .link-titre{color: #ffffff;font-size: 12px;font-style: normal;font-weight: normal;text-transform: uppercase;-webkit-transition: all .6s ease-in;-moz-transition: all .6s ease-in;-o-transition: all .6s ease-in;transition: all .6s ease-in;} .link-titre:hover{color: #fffff !important; padding:10px;} .description{background-color: rgba(0, 0, 0, 0.2);margin-top: 3px;margin-bottom: 5px;padding: 8px;width:102%; height:70px; overflow:auto;border-radius: 4px 4px 4px 4px;margin-left: -17px;padding-left: 17px;} .dernierPoste{font-size: 11px !important;font-style: normal;color: #5d5d5d !important;display: inline-table !important;padding-left: 17px !important;padding-right: 10px !important;height: 23px !important;line-height: 23px !important;background-color: rgba(0, 0, 0, 0.2) !important;} #dernierPoste1 {margin-left: 10px;color: #5d5d5d !important;display: inline-table;padding-left: 10px;padding-right: 10px;height: 23px;line-height: 23px;background-color: rgba(0, 0, 0, 0.2);} .img-descr{position:absolute;z-index: 10;margin-left: -197px;margin-top: -16px;width:176px;height:116px;background-repeat: no-repeat;background-position: center center;transform:rotate(-2deg);-ms-transform:rotate(-2deg);-moz-transform:rotate(-2deg);-webkit-transform:rotate(-2deg);-o-transform:rotate(-2deg);} .bg-desc{margin-left: 20px;transform:rotate(-2deg);-ms-transform:rotate(-2deg);-moz-transform:rotate(-2deg);-webkit-transform:rotate(-2deg);-o-transform:rotate(-2deg);width:176px;height:116px;background-color: transparent;background-image: url("https://2img.net/r/hpimg11/pics/968440imgdesc1.png");border: 5px #ffffff solid;background-repeat: no-repeat;background-position: center center;} .sf{position: absolute;margin-top: -120px;margin-left: 25px;z-index: 50;width:176px;height:116px;background-color: transparent !important;text-decoration: none !important;transform:rotate(-2deg);-ms-transform:rotate(-2deg);-moz-transform:rotate(-2deg);-webkit-transform:rotate(-2deg);-o-transform:rotate(-2deg);} .sfbtn{position: absolute;margin-left: 17px;margin-top: 86px;width: 90px;transform:rotate(2deg);-ms-transform:rotate(2deg);-moz-transform:rotate(2deg);-webkit-transform:rotate(2deg);-o-transform:rotate(2deg);} .sf:hover {z-index: 50;} .sf div {display: none;} .sf:hover div {display: block;position: absolute;top: 18px;left: 170px;width: 630px;height: 65px;overflow: auto;background-color: transparent;color: #000;text-align: justify;font-weight: none;padding: 10px;transform:rotate(2deg);-ms-transform:rotate(2deg);-moz-transform:rotate(2deg);-webkit-transform:rotate(2deg);-o-transform:rotate(2deg);} #sfbg{background-color: #ff00 !important;} /*--- Profil Message --- */ .namepost{position: relative;top: -10;right: 0px;z-index: 5;padding-right: 10px;letter-spacing: -2px;font-size: 24px;font-weight: bold !important;font-family: 'Lobster', cursive;text-shadow: 5px 5px 5px #000000;} .namepost:first-letter {font-size: 30px;} .rankpost{position: relative;top: -19;right: 0px;z-index: 2;padding-right: 15px;font-size: 12px;font-family: 'Montserrat', sans-serif;text-transform: uppercase;} .contenu_message{padding: 10px;text-align: justify;background-position: center top;background-repeat: repeat-y;background-image: url("https://2img.net/r/hpimg11/pics/395047catfond2.png");} .profil1{height: 32px;background-position: center bottom;background-repeat: no-repeat;background-image: url("https://2img.net/r/hpimg11/pics/929162catfond01.png");} .profil_reel{position: relative;width: 100%;height: 160px;background-image: url("https://2img.net/r/hpimg11/pics/285095sfbg.png");background-repeat: repeat;-webkit-box-shadow: 0 10px 20px -8px rgba(0,0,0,0.6);box-shadow: 0 15px 20px -8px rgba(0,0,0,0.6);} .avatar_reel{width: 150px;height: 150px;overflow: hidden;float: right;border: 5px solid rgba(255, 255, 255, 0.1);} .contactfield {width: 150px;height: 150px;overflow: auto;} .contactfield img{-webkit-transition: all .6s ease-in;-moz-transition: all .6s ease-in;-o-transition: all .6s ease-in;transition: all .6s ease-in;} .contactfield img:hover{opacity: 0.5;} .online_img:empty {position: absolute;z-index: 10;top: 86px;right: -25px;background-image: url(https://2img.net/r/hpimg11/pics/357506off.png);width: 91px;height: 74px;} .online_img {position: absolute;z-index: 15;top: 86px;right: -25px;width: 91px;height: 74px;} .post1, .post2, .post3{text-align: left;font-size: 12px;font-family: 'Montserrat', sans-serif;color: #666;} .post1{padding-left: 8px;padding-right: 8px;padding-top: 6px;padding-bottom: 6px;background-color: rgba(0,0,0, 0.8) !important;} .post3{position: absolute;top: 18px;left: 48px;font-size: 11px;} .pfield{padding: 8px;margin-left: 10px;margin-top: 20px;overflow: auto;width: 100%;height: 98px;background: rgba(0, 0, 0, 0.2);} .pfield1 .label{text-align: left !important;font-size: 12px !important;font-family: 'Montserrat', sans-serif !important;color: #666 !important;} .pfield2{text-align: left !important;font-size: 12px !important;font-family: 'Montserrat', sans-serif !important;color: #c1c1c1 !important;} .btnmodif{background-position: center top;background-repeat: repeat-y;background-image: url("https://2img.net/r/hpimg11/pics/395047catfond2.png");} .messagebloc{padding: 10px;background: rgba(0, 0, 0, 0.2);} .ttopic{width: 100%;height: 30px;line-height: 30px;text-align: left;font-size: 12px;font-family: 'Montserrat', sans-serif;text-transform: uppercase;color: #666;}

(donc remplacez tout le code que vous m'avez donné par celui-ci.)

par chocobook Lun 30 Avr 2018 - 17:04

Bonjour,
merci pour votre aide, ça fonctionne.
Bonne fin de journée.

Image des catégories en décalage par rapport au cadre