Espace dans l'affichage des données du profil dans les sujets.

[Argimpasa]

Détails techniques

Version du forum : ModernBB
Poste occupé : Fondateur
Navigateur(s) concerné(s) : Mozilla Firefox, Google Chrome, Internet Explorer
Capture d'écran du problème :

Voir l'image:

Personnes concernées par le problème : Tous les utilisateurs
Problème apparu depuis : 06/06/2023
Lien du forum : https://royalemasquerade.forumactif.com/t15-les-titres-de-noblesses

Description du problème

Bonjour,

Je suis désolée de vous ennuyer à nouveau, j'espère que ce souci de codage qui vient d'apparaître sera le dernier.
Comme vous pouvez le voir, il y'a un immense espace entre la donnée messages (on ne la voit pas sur l'image) et le reste des informations du profil. J'ignore d'où peut venir ce problème. Merci de votre aide.

CSS :

Code:

/*- - - - - - - - - - - - - - - - - - - - PA PA PA - - - - - - - - - - - - - - - - - - - -*/

.subtitle_pa, .subtitle_pa * {
  color: var(--d3);
  font-size: 10px;
}

.bp_pa {
  display: grid;
  grid-gap: var(--mo);
  grid-template:
    "top_left top_center top_right" 150px
    "bottom_left bottom_center bottom_right" var(--total-height-staff)
  / 1fr 1fr 1fr;
  --actual-height-input-staff: 4px;
  --height-infos-staff: 50px;
  --height-input-staff: calc(var(--actual-height-input-staff) + var(--margin-staff));
  --margin-staff: var(--mo);
 
  --total-height-staff: calc(var(--height-input-staff) + var(--height-infos-staff));
}

.bp_pa > * {
  margin: 0 !important;
}

.icon_pa {
  grid-area: top_left;
}

.icon_pa img {
  width: 100%;
  height: 100%;
}

.context_pa {
  grid-area: top_center;
}

.infos1_pa {
  grid-area: top_right;
}

.infos2_pa {
  grid-area: bottom_left;
 
  font-size: 11px;
  font-style: italic;
  line-height: 14px;
  text-align: justify;
}

/*staff*/

.staff_pa {
  grid-area: bottom_center;
  position: relative;
}

.input_pa {
  height: var(--height-input-staff);
  border-bottom: var(--margin-staff) solid var(--l1);
  background: var(--m1);
}

.input_pa:last-of-type {
  margin: 0 !important;
}

.input_pa:hover {
  background: var(--h1);
}

.input_pa:checked {
  background: var(--h2);
}

.about_staff_pa {
  display: none;
  width: 100%;
  height: calc(100% - var(--height-input-staff));
  position: absolute;
  bottom: 0;
  left: 0;
}

.input_pa:checked + .about_staff_pa {
  display: block;
}

.about_staff_pa > div {
  width: 100%;
  height: 100%;
}

.infos_staff_pa {
  padding-right: var(--mo);
 
  font-size: 11px;
}

.infos_staff_pa i {
  opacity: .8;
 
  font-size: 10px;
}

.infos_staff_pa a {
  color: inherit;
}

.icon_staff_pa {
  width: var(--height-infos-staff);
  height: var(--height-infos-staff);
}

.icon_staff_pa img {
  width: 100%;
  height: 100%;
}

/*partners*/

.partners_pa {
  grid-area: bottom_right;
 
  line-height: 20px;
}

.partners_pa tag {
  font-size: 10px;
}
/*- - - - - - - - - - - - - - - - - - - - GLOBAL GLOBAL GLOBAL - - - - - - - - - - - - - - - - - - - -*/

:root{
  --l0: #ffffff; /*light 0*/
  --l1: #f2f2f2; /*light 1*/
  --l2: #63708b; /*light 2*/
  --l3: #d5d5d5; /*#light 3*/
  --l4: #EBEBEB; /*light 4*/
 
  --m1: #7e8dac; /*moyen 1*/
  --m2: #6b7fa3; /*moyen 2*/

  --d1: #31465C; /*dark 1*/
  --d2: #31465c; /*dark 2*/
  --d3: #0F161E; /*dark 3*/

  --h1: #3E6EAB; /*highlight 1: bleu moyen*/
  --h2: #7392B5; /*highlight 2: bleu clair*/
  --h3: #db9641; /*highlight 3: brun moyen*/
  --h4: #dba058; /*highlight 4: brun clair*/
  --h5: #c65b51; /*highlight 5: rose moyen*/
  --h6: #859652; /*highlight 6: vert moyen*/
  --h7: #916e9c; /*highlight 7: violet moyen*/


 
 
 
  --sm: 6px;
  --mo: 12px;
  --bg: 25px;
  --lg: 50px;
  --gi: 100px;
 
  --grid-gap: var(--mo);
 
 
  --header-width: 950px; /* LARGEUR HEADER ET LARGEUR FORUM */
 
  --main-color: var(--d3);
  --main-font: 'Mulish', Verdana, sans-serif;
 
  --main-border-thin: 2px solid var(--m1);
  --main-border: 3px solid var(--m1);
  --main-border-thick: 6px solid var(--m1);
  --main-border-radius: 2px;/*BORDS ARRONDIS DE TOUS LES BLOCKS : remplacer par "2px" par 0 pour ne pas avoir de bord arrondi du tout*/
  /*--main-box-shadow: 0 0 5px var(--m1); OMBRE PORTÉE DE TOUS LES BLOCKS : remplacer par "0 0 5px" par "0 0 0" pour ne pas en avoir*/
  --main-box-shadow: 0 0 5px var(--m1);
  --main-box-shadow-highlight: 0 0 3px var(--d1); /*OMBRE PORTÉE E CERTAINS BLOCKS : remplacer par "0 0 3px" par "0 0 0" pour ne pas en avoir*/
 
  --table-background: var(--l2);
  --table-highlight-background: var(--l3);
  --table-header-background: var(--h1);
 
  color: var(--d3);
  font-family: 'Mulish';
  font-size: 16px;
  line-height: 20px;
  text-align: justify;
}

HTML {
  height: auto;
  min-height: 100%;
  background: linear-gradient(#b9c4d4, #979ab3); /*FOND DU FORUM en dégradé, remplacer une image ou une couleur si voulu*/
}

body {
  background: transparent;
}

/* nom | durée | fonction | retard */

HTML *{
  transition: all var(--transt) ease;
  -webkit-transition: all var(--transt) ease;
  -moz-transition: all var(--transt) ease;
  -ms-transition: all var(--transt) ease;
  -o-transition: all var(--transt) ease;
  --transt: .4s;
}

HTML, HTML * {
  box-sizing: border-box;
}










/*- - - - - - - - - - - - - - - - - - - - FONTS FONTS FONTS - - - - - - - - - - - - - - - - - - - -*/

a{
  color: var(--h3);
  text-decoration: none !important;
}

a:hover{
  color: var(--h4);
}

a, a:visited{
  text-decoration: none;
}

a:hover, input:hover, label:hover{
  color: var(--h2);
  cursor: crosshair;
}

a.forumtitle, a.forumtitle:visited, a.forumtitle:link {
  color: unset;
}

input[type=text]:hover{
  color: unset;
}

u {
  text-decoration: none;
  border-bottom: 1px solid;
}

::selection{
  background: var(--m2);
  color: var(--l2);
}





/*- - - - - h2, h3, h4, h5, h6 - - - - -*/

h2 {
  color: var(--m2);
  font-family: 'Playfair Display';
  font-size: 18px;
  font-weight: normal;
  font-style: normal;
  text-transform: uppercase;
}

h2::before {
  content: '[ ';
}

h2::after {
  content: ' ]'
}

.simple h2 {
  margin: 0;
}

h2 + pp {
  display: block;
  margin-top: var(--sm);
  border-top: 1px solid;
  padding: var(--sm) var(--sm) 0;
  opacity: .7;
 
  text-transform: lowercase;
}

h2 + pp a {
  color: inherit !important;
}

h3{
  margin: 0;
  color: var(--h4);
  font-family: 'Playfair Display';
  font-size: 18px;
  letter-spacing: -1px;
  font-weight: normal;
  text-transform: lowercase;
}

h4, .quick_reply_topic div.h3 {
  padding: 0 var(--mo) var(--sm);
  border: 0;
  border-bottom: 1px solid var(--highlight-color);
 
  color: var(--d3);
  font-family: 'Rozha One', 'Abril Fatface', serif;
  font-size: 24px;
  font-weight: normal;
  text-shadow: 1px 0 0 var(--highlight-color);
  --highlight-color: var(--m2);
}





/*- - - - - ro, rou - - - - -*/

ro, rou {
  font-family: 'Rozha One', 'Abril Fatface', serif;
  font-weight: normal;
  font-style: normal;
}

ro {
  color: var(--d3);
  text-transform: lowercase;
}

rou {
  color: var(--d2);
  text-transform: uppercase;
  letter-spacing: 1px;
}

.dark ro, .dark rou {
  color: var(--l4);
}





/*- - - - - pl, plu, pp, ppb - - - - -*/

pl, plu, pp, ppb {
  font-family: 'Playfair Display';
  font-weight: normal;
}

pl {
  text-transform: lowercase;
}

plu {
  color: var(--d1);
  text-transform: uppercase;
  font-style: normal;
}

pp, ppb {
  color: var(--d1);
  font-size: 0.9rem;
  font-style: italic;
  letter-spacing: 5px;
}

.dark pp, .dark ppb {
  color: var(--m2);
}

pp:hover, ppb:hover {
  color: var(--h3);
  letter-spacing: 6px;
}

ppb {
  display: block;
  width: 90%;
  margin: var(--sm) auto 0;
}

ppb:before, ppb:after {
  content: ' — ';
}





/*- - - - - tag, btag, dtag - - - - -*/

tag, btag, dtag {
  text-transform: lowercase;
  font-style: normal;
  font-weight: bold;
  text-align: left;
}

tag {
  padding: 3px var(--sm);
}

tag, btag {
  background: var(--l4);
 
  color: var(--d3);
}

dtag {
  background: var(--d1);
  margin: var(--sm);
 
  color: var(--l4);
}

btag, dtag {
  box-shadow: var(--main-box-shadow);
  padding: var(--sm) var(--mo);
}

a tag, a btag {
  color: var(--h1);
}

a dtag {
  color: var(--h1);
}





/*- - - - - ch, vh - - - - -*/

ch, vh, cv {
  font-style: normal;
  font-weight: bold;
  letter-spacing: 1px;
}

ch {
  color: var(--h1);
}

vh {
  color: var(--h3);
}

cv {
  color: var(--d3);
}





/*- - - - - other - - - - -*/

qq {
  opacity: .7;
 
  font-size: 0.9rem;
  font-style: normal;
  font-weight: normal;
  letter-spacing: 2px;
  text-transform: uppercase;
}

sms {
  opacity: .7;
 
  font-family: 'Courrier New', monospace;
  font-size: 0.9rem;
  font-style: normal;
  font-weight: normal;
  letter-spacing: 1px;
}

lgn{
  display: block;
  width: 100%;
  height: 0;
  border-bottom: 1px solid var(--l4);
  margin: var(--grid-gap) auto;
}









/*- - - - - - - - - - - - - - - - - - - - ELEMENTS (buttons, inputs & co) - - - - - - - - - - - - - - - - - - - -*/

input, button, textarea {
  outline: none;
  font-family: inherit;
}

a, input, button {
  cursor: crosshair;
}

button, .button1, .button2 {
  text-transform: lowercase;
}

[class^=bp_] input, [class^=bp_] button {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  margin: 0px;
  box-sizing: border-box;
  outline: none;
}

.button1 {
  background: var(--h3) !important;
  box-shadow: var(--main-box-shadow) !important;
 
  font-family: inherit;
}

.button1:hover {
  background: var(--h4) !important;
  box-shadow: var(--main-box-shadow-highlight) !important;
}

.button2 {
  background: var(--h1) !important;
  box-shadow: var(--main-box-shadow) !important;
 
  font-family: inherit;
}

.button2:hover {
  background: var(--h2) !important;
  box-shadow: var(--main-box-shadow-highlight) !important;
}

img {
  object-fit: cover;
}










/*- - - - - - - - - - - - - - - - - - - - BLOCKS BLOCKS BLOCKS - - - - - - - - - - - - - - - - - - - -*/





/* - - - - - FORUMACTIF - - - - - */

.codebox::before, blockquote::before {
  display: none !important;
  content: none !important;
}

dl.codebox {
  padding: var(--mo);
  margin: var(--mo) auto;
  border: 0;
  border-radius: var(--main-border-radius);
  box-shadow: var(--main-box-shadow);
}

dl.codebox:not(.spoiler):not(.hidecode) {
  padding-bottom: 30px;
}

dl.codebox > dt, blockquote cite {
  color: var(--d3);
  font-family: 'Playfair Display';
  font-style: normal;
  font-weight: bold;
}

dl.codebox:not(.spoiler) > dt, blockquote cite {
  text-transform: lowercase;
}

.codebox.spoiler {
}

.codebox.hidecode {
}

blockquote {
  background: transparent !important;
  border: unset;
  margin-left: 30px;
  margin-right: 30px;
}

blockquote cite {
  background: var(--m2);
  margin-left: calc(-1 * var(--mo));
  margin-right: calc(-1 * var(--mo));
  margin-bottom: var(--sm);
  padding: var(--sm) var(--mo);
  border-radius: var(--main-border-radius);
  box-shadow: var(--main-box-shadow);
}

#topicreview {
  height: auto !important;
  max-height: 900px !important;
}

fieldset, p, .button1, .button2, #fa_ticker *, input[type="submit"], #tabs ul li {
  font-size: 1rem;
  line-height: 1.3rem;
}





/* - - - - - GENERAL - - - - - */

scroll{
    flex: 1 1 auto;
    display: block;
    width: 100%;
    height: 100%;
    overflow: auto;
}

*::-webkit-scrollbar{
  width: 0px;
}

[class^=bp_] input.onglet + div, [class^=bp_] input.onglet + label + div{
  display: none;
}

[class^=bp_] input.onglet:checked + div, [class^=bp_] input.onglet:checked + label + div{
  display: block;
}

table{
  width: 100%;
  height: 100%;
  border-collapse: collapse;

  color: inherit;
  text-align: inherit;
  font-size: inherit;
}





/* - - - - - BLOCKS DIVERS - - - - - */

.column{
  column-count: 2;
  column-gap: 25px;
}

.column.rule{
  column-gap: 40px;
  column-rule: 1px solid var(--l4);
}

.column *{
  break-inside: avoid;
}

k{
  display: block;
  text-align: center;
}

k img{
  max-width: 200px;
}

.moodboard{
  width: 100%;
  column-count: 3;
  column-gap: var(--gap);
  --gap: 15px;
}

.moodboard:hover img{
  opacity: 1;
}

.moodboard img{
  width: 100%;
  margin-bottom: var(--gap);
  opacity: .7;
  border-radius: 3px;
}


/* - - - - - FLEX - - - - - */

.flexrow, .flexcolumn{
  display: flex;
  justify-content: space-between;
}

.flexrow {
  overflow: hidden;
}

.flexrow > *{
  flex: 1;
  margin: 0 !important;
  margin-right: var(--grid-gap) !important;
}

.flexrow > img {
  display: block;
  height: 100%;
}

.flexcolumn > *:last-child, .flexrow > *:last-child {
  margin: 0px !important;
}

.flexcolumn {
  flex-direction: column;
}

.flexcolumn.fixed {
  height: var(--height);
  --height: 200px;
}

.flexcolumn > * {
  flex: 1 1 auto;
  margin: 0 !important;
  margin-bottom: var(--grid-gap) !important;
}

.flexcolumn > * {
  height: 0;
}

.flexcolumn > .no-extend {
    height: auto;
}

.flex {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  flex-wrap: wrap;
  grid-gap: var(--mo);
  --max: 250px;
}

.flex > * {
  flex: 1 0 var(--max);
  margin: 0 !important;
}

.flex .first{
  flex: 0 0 100% !important;
}

.no-extend{
    flex: 0 0 auto;
}

.extend{
    flex: 1 1 auto;
}

/*- - - - - AESTHETIC BLOCKS - - - - -*/

.simple{
  margin: var(--mo) 0 0;
  padding: var(--mo);
  border-radius: var(--main-border-radius);
}

.small{
  padding: var(--sm);
}

.nomargin{
  margin: 0 !important;
}

.nopadding{
  padding: 0 !important;
}

.noborder{
    border: 0 !important;
}

ul.nobullet{
    list-style-type: 0;
    padding: 0;
    margin: 0;
}

.none{
    display: none;
}

.overflow-visible {
  overflow: visible !important;
}

.relative{
  position: relative;
}

.absolute{
  position: absolute;
}

.fixed:not(.flexcolumn):not(.flexrow):not(.flex){
  position: fixed;
}

.light{
  background: var(--l1);
  box-shadow: var(--main-box-shadow);
}

.light .light{
  background: var(--l2);
}

.light .light .light {
  background: var(--l3);
}

.light .light .light .light {
  background: var(--l4);
}

.light.highlight:hover {
  background: var(--d1);
 
  color: var(--l4);
}

.middle{
  background: var(--m1);
  box-shadow: var(--main-box-shadow);
}

.middle.highlight:hover {
  background: var(--d1);
  color: var(--l4);
}

.dark{
  background: var(--d2);
  box-shadow: var(--main-box-shadow);

  color: var(--l4);
}

.dark.highlight:hover {
  background: var(--d3);
  color: var(--h3);
}

.h1{
  background: var(--h1);
  box-shadow: var(--main-box-shadow);
}

.h2{
  background: var(--h2);
  box-shadow: var(--main-box-shadow);
}

.h3:not(h2){
  background: var(--h3);
  box-shadow: var(--main-box-shadow);
  font-size: inherit !important;
  border: unset;
}

.h4{
  background: var(--h4);
  box-shadow: var(--main-box-shadow);
}
.h5{
  background: var(--h5);
  box-shadow: var(--main-box-shadow);
}
.h6{
  background: var(--h7);
  box-shadow: var(--main-box-shadow);
}
.h7{
  background: var(--h6);
  box-shadow: var(--main-box-shadow);
}
.left-align{
  text-align: left !important;
}

.center-align{
  text-align: center !important;
}

.right-align{
  text-align: right !important;
}

.justify-align{
  text-align: justify !important;
}

qsdf{
  display: block;
  text-align: right;
}

wxcv{
  display: block;
  text-align: center;
}

.lowercase{
  text-transform: lowercase;
}

.uppercase{
  text-transform: uppercase;
}

qt{
    display: block;
    margin: var(--mo) 0 var(--mo) var(--mo);
    padding: var(--sm) 0 var(--sm) var(--mo);
    border-left: 1px solid var(--l4);
}




















/*- - - - - - - - - - - - - - - - - - - - HEADER HEADER HEADER - - - - - - - - - - - - - - - - - - - -*/

.headerbar{
  background: transparent;
  height: auto;
}

#new-headerbar-top {
  width: 100%;
  margin-top: var(--bg);
  padding: var(--sm) 0;
 
  text-align: center;
}

#logo {
  float: none;
  width: var(--header-width);
  background: var(--l0);
  margin: 0 auto;
  padding: var(--sm);
  box-shadow: var(--main-box-shadow);
}

#logo img {
  width: 100%;
}

#site-desc{
  display: none;
}










/*- - - - - - - - - - - - - - - - - - - - BODYLINE BODYLINE BODYLINE - - - - - - - - - - - - - - - - - - - -*/

#wrap{
  background: var(--l0);
  border: var(--sm) solid var(--l1);
  box-shadow: var(--main-box-shadow);
  margin: var(--bg) auto 0;
}

#wrap{
  width: var(--header-width);
  font-size: 1rem;
  line-height: 1.3rem;
}





/*- - - - - FOOTER - - - - -*/

#page-footer {
  background: transparent;
}

#page-footer .wrap, #page-footer .footerbar-system {
  padding: 0;
}

#page-footer * {
  color: var(--footer-color);
  --footer-color: var(--m2);
  font-size: 0.9rem;
  font-style: italic;
  letter-spacing: 1px;
  text-transform: lowercase;
}

.copyright-body{
  border: none;
  margin-bottom: var(--bg);
}

.copyright-body a{
  display: block;
  width: 100%;
  padding-top: var(--mo);
  border-top: 1px solid var(--footer-color);
 
  font-size: 1.2rem;
}





/*- - - - - OTHER - - - - -*/

form[name=form_login] div.h3, form[name=form_login] + script + div.panel div.h3 {
  background: transparent !important;
  box-shadow: none !important;
  border-bottom: 1px solid;
}

/*delete last pub post for guests*/

#p0 {display: none !important;}










/*- - - - - - - - - - - - - - - - - - - - TOOLBAR + NAVBAR - - - - - - - - - - - - - - - - - - - -*/





/*- - - - - NAVBAR - - - - -*/

.navbar{
  width: auto;
  background: var(--d1);
  padding: var(--sm);
  border-radius: var(--main-border-radius);
  box-shadow: var(--main-box-shadow);
  position: fixed;
  top: var(--margin);
  left: var(--margin);
  z-index: 999;
  --margin: var(--mo);
}

.navbar li{
  margin: 0;
}

.navbar a{
  font-family: 'Playfair Display';
  font-size: 0.8rem;
  letter-spacing: 1px;
  text-transform: uppercase;
}

.navbar a:hover{
  background: transparent;
  box-shadow: none;
 
  color: var(--h2);
  letter-spacing: 2px;
}

.navbar .new-message {
  background: var(--h1);
}





/*- - - - - TOOLBAR - - - - -*/

#fa_toolbar {
  background: transparent;
  z-index: 900;
  height: 0;
}

#fa_left, #fa_search, #fa_share, #fa_hide {
  display: none !important;
}

#fa_right {
  background: var(--d1);
  padding: var(--margin) var(--mo);
  --margin: var(--sm);
  border-radius: var(--main-border-radius);
  box-shadow: var(--main-box-shadow);
  position: fixed;
  top: var(--mo);
  right: var(--mo);
 
  text-transform: lowercase;
  font-size: 1rem;
  line-height: 1.3rem;
}

#fa_welcome {
  margin: 0 !important;
  padding: 0 !important;
}

#fa_right > *{
  margin: 0 !important;
  margin-left: var(--margin) !important;
  padding: 0 !important;
}

#fa_right > *:first-child{
  margin-left: 0 !important;
}

#fa_menulist, #notif_list {
  min-width: 425px;
  max-width: 600px;
  left: unset !important;
  right: 0 !important;
 
  font-size: 1rem !important;
  line-height: 1.3rem !important;
}

#fa_menulist {
  min-height: 300px;
}

#fa_menulist table {
  height: auto !important;
}










/*- - - - - - - - - - - - - - - - - - - - FORABG & TABLES - - - - - - - - - - - - - - - - - - - -*/

/*body*/

.forumbg, .table1, .panel, .block, .forumline, .overview.row3 {
  border-radius: var(--main-border-radius);
}

.topiclist.forums > li, .panel, .row1, .row2, .block, .forumline, .overview.row3 {
  background: var(--table-background);
}

.table1 td:hover {
  background: unset !important;
}

.block, .forumbg, .forumbag, .panel, .post, #textarea_content, .forumline {
  box-shadow: var(--main-box-shadow);
}

.panel.row3, #cp-main .panel.sig {
  background: transparent;
  box-shadow: none;
}

/*small highlights*/

.table1 .row3 {
  background: var(--table-highlight-background);
}

/*titles & headers*/

.topiclist > li.header, .table1 th, .forumline th {
  background: var(--table-header-background);
}

h2.h3 {
  border-color: var(--table-header-background);
  color: var(--table-header-background);
}










/*- - - - - - - - - - - - - - - - - - - - TOPIC TOPIC TOPIC - - - - - - - - - - - - - - - - - - - -*/

.subtitle_topic {
  margin-top: var(--mo);
}

.subtitle_topic btag {
  margin-right: var(--mo);
}

.navtree_topic {
  border-left: 1px solid var(--m1);
  padding: 3px 0 4px var(--mo);
}

.navtree_topic a{
  color: inherit;
}

/*- - - - - POSTROW - - - - -*/

.bp_post {
  margin-top: 40px;
}

.content_post {
  display: grid;
  grid-gap: var(--mo);
  grid-template-columns: var(--width-left) 1fr;
  --width-left: calc(var(--width-ava) + 2 * var(--border-ava));
  --width-ava: 200px;
  --height-ava: 320px;
  --height-date: 20px;
  --height-contact: 30px;
  --border-ava: 7px;
}

/*left*/
.left_post {
  box-sizing: content-box;
}

.avatar_post {
  height: var(--height-ava);
  background: var(--m1);
  padding: var(--border-ava);
  box-shadow: var(--main-box-shadow);
  border-radius: var(--main-border-radius);
}

.left_post img {
  width: 100%;
  height: 100%;
}

.profil_post {
  max-height: 200px;
  overflow: auto;
 
  /*line-height: 22px;
  font-style: italic;*/
  font-size: 0.9rem;
}

.profil_post img {
  max-width: 100%;
}

.rank_post, .contact_title_post, .contact_post img {
  height: var(--height-contact);
  padding: 3px var(--mo);
}

/*right*/

.infos_post {
  height: var(--height-date);
}

.infos_post > * {
  height: 100%;
}

.infos_post .simple {
  padding: 0 var(--mo) !important;
}

.profile-icons a {
  display: inline;
  height: auto !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
}

.profile-icons a:hover {
  color: var(--h1);
}

.ancre_post, .option_post {
  flex: 0 0 auto;
}

.option_post i {
  position: relative;
  top: 2px;
}

.post_post {
  min-height: calc(var(--height-ava) - var(--mo) - var(--height-date));
}

/*contact*/

.contact_post {
  height: var(--height-contact);
  margin-top: var(--mo);
}

.profile-icons {
  margin: 0 !important;
}

.contact_post > *, .profile-icon {
  display: inline-block;
  width: auto;
  height: 100% !important;
  margin: 0;
  margin-right: var(--mo);
}

.contact_post > *:last-child {
  margin-right: 0;
}

.contact_post img {
  padding: 0;
}

/*signature*/

.signature_post br:first-child, .signature_post br:nth-child(2) {
  display: none;
}





/*- - - - - OTHER - - - - -*/

.topic-actions.bottom, .topic-actions.bottom * {
  font-size: 1rem;
}

.quick_reply_topic div.h3 {
  background: transparent;
  box-shadow: none !important;
}

.options_topic {
  margin: var(--bg) auto var(--sm);
}

.options_topic *:not(h4) {
  font-size: 1rem;
}

.goto_topic {
  margin-left: var(--mo) !important;
}





/*- - - - - PREVISUALISATION - - - - -*/

.post_preview {
  padding: var(--bg) var(--half-mg);
  --half-mg: calc(0.5 * 250px); /*200px + 2 * 12px + 12px + 14px*/
}









/*- - - - - - - - - - - - - - - - - - - - CATEGORIES CATEGORIES CATEGORIES - - - - - - - - - - - - - - - - - - - -*/

.container_cat.forabg {
  background: transparent !important;
  box-shadow: none !important;
  border: 0 !important;
}

.forabg.hidden .bp_cat {
  display: none;
}

.content_cat {
  display: grid;
  margin-top: var(--bg);
  grid-template:
    "tit  tit  tit tit" auto
    "desc links ava infos" var(--height-cat)
  / 1fr var(--width-links) var(--width-ava) var(--width-infos);
  grid-gap: var(--sm);
  --height-cat: 80px;
  --width-links: 175px; /*avant : 180px*/
  --width-ava: calc(0.625 * var(--height-cat));
  --width-infos: var(--width-links);
 
  --width-icon: var(--height-cat);
}

* .content_cat:first-of-type {
  margin-top: 0;
}

.content_cat > * {
  margin: 0;
}

/*title*/
.title_cat{
  grid-area: tit;
  padding-left: calc(var(--width-icon) + var(--mo));
  padding-left: calc(var(--width-icon) + var(--mo));
}

.title_cat > * {
  font-size: 15px;
}

.stats_cat {
  display: inline-block;
  margin-left: var(--mo);
 
  font-size: 0.9rem;
}

/*description*/
.description_cat{
  grid-area: desc;
  border-radius: var(--main-border-radius);
  overflow: hidden;
 
  font-size: 0.9rem;
  line-height: 1rem;
}

.icon_cat {
  flex: 0 0 var(--width-icon);
  margin: 0 !important;
  position: relative;
  z-index: 100;
}

.icon_cat img {
  width: 100%;
  height: 100%;
}

.content_cat:hover {
  --width-icon: calc(0.5 * var(--height-cat));
}

.desc_cat {
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
}

/*link*/

.links_cat {
  grid-area: links;
  font-size: 0.9rem;
  text-align: left;
}

/*avatar*/

.avatar_cat {
  grid-area: ava;
  overflow: hidden;
  padding: 4px;
}

.avatar_cat img {
  width: 100%;
  height: 100%;
  filter: grayscale(100%);
}

.content_cat:hover .avatar_cat img {
  filter: none;
}

/*infos*/

.infos_cat {
  font-size: 0.9rem;
  line-height: 1.2rem;
}









/*- - - - - - - - - - - - - - - - - - - - TOPICLIST & MESSAGELIST - - - - - - - - - - - - - - - - - - - -*/





/*- - - - - GENERAL TOPICLIST - - - - -*/

.bp_topiclist > .content_topiclist:first-child {
  margin-top: 0;
}

.content_topiclist {
  display: grid;
  grid-template:
    ". icon title title inpt ava infos" auto
    ". icon stats nav  inpt ava infos" auto
  / var(--margin1) var(--sq-icon) 2fr 1fr var(--sq-ava) var(--sq-ava) var(--width-info);
  grid-gap: var(--sm);
  --width-info: 170px;
  --sq-icon: 40px;
  --sq-ava: 40px;
  --margin1: 10px;
}

.content_topiclist.search_topiclist {
  grid-template:
    ". icon title title infos" auto
    ". icon stats nav  infos" auto
  / var(--margin1) var(--sq-icon) 2fr 1fr var(--width-info);
}

.content_topiclist > section {
  border: 1px solid red;
}

/*icon & title*/

.icon_topiclist {
  grid-area: icon;
  position: relative;
}

.icon_topiclist img {
  width: var(--sq-icon);
  height: var(--sq-icon);
  /*border-radius: 50%;
  border: 2px solid var(--m2);*/
}

.title_topiclist {
  grid-area: title;
  border-bottom: 1px solid var(--color);
  --color: var(--d3);
}

.title_topiclist * {
  color: var(--color);
}

.content_topiclist:hover .title_topiclist * {
  color: var(--h3);
}

.title_topiclist h3 {
  display: inline;
  border: 0;
}

.title_topiclist i {
  margin-left: var(--mo);
  opacity: .7;
}

.title_topiclist i::before {
  content: '“';
}

.title_topiclist i::after {
  content: '”';
}

/*stats & nav*/

.stats_topiclist {
  grid-area: stats;
  position: relative;
  top: -5px;
 
  font-size: 0.9rem;
}

.nav_topiclist {
  grid-area: nav;
  position: relative;
  top: -5px;
 
  font-size: 0.9rem;
}

/*avatar*/

.avatar_topiclist {
  grid-area: ava;
  position: relative;
}

.avatar_topiclist img {
  width: var(--sq-ava);
  height: var(--sq-ava);
  border-radius: 50%;
  border: 2px solid var(--m2);
  filter: grayscale(100%);
}

.input_topiclist {
  grid-area: inpt;
}

.input_topiclist input {
  width: var(--sq-ava);
  height: var(--sq-ava);
  background: var(--h1);
  margin: 0;
  border-radius: 50%;
}

.input_topiclist input:hover, .input_topiclist input:checked {
  background: var(--h3);
}

.infos_topiclist {
  grid-area: infos;
}

.mp_answer_img_topiclist {
  width: 140px;
}

.mp_answer_img_topiclist.quote_topiclist {
  width: 30px;
}

.mp_answer_img_topiclist img {
  width: 100%;
  height: 100%;
}





/*- - - - - OTHER TOPICLIST - - - - -*/

.topic-actions.bottom {
  margin: var(--mo) auto;
}

#watchforum {
  margin-right: var(--mo);
}

.infos_bottom_topiclist br:first-of-type{
  display: none;
}

.checkingbox_topiclist input {
  width: var(--sq);
  height: var(--sq);
  --sq: 20px;
  background: var(--m1);
  margin-left: var(--mo);
  border: 2px solid var(--m1);
  border-radius: 50%;
  box-shadow: var(--main-box-shadow);
}

.checkingbox_topiclist input:hover {
  background: var(--h1);
}

.checkingbox_topiclist input:checked {
  background: var(--h2);
}





/*- - - - - GENERAL MESSAGELIST - - - - -*/

.bp_messagelist {
  display: grid;
  grid-gap: var(--mo);
  grid-template:
    "title  title title" auto
    "author stats message" auto
    "place  place message" auto
    "date  date  message" auto
    ".      .    message" auto
    / var(--left) var(--left) 1fr;
  --left: 120px;
}

.bp_messagelist > * {
  margin: 0;
}

.bp_messagelist img {
  max-width: 100%;
}

.title_messagelist {
  grid-area: title;
}

.author_messagelist {
  grid-area: author;
}

.stats_messagelist {
  grid-area: stats;
}

.place_messagelist {
  grid-area: place;
}

.date_messagelist {
  grid-area: date;
  border-top: 1px solid var(--l4);
  padding-top: var(--sm);
 
  font-size: 0.9rem;
}

.message_messagelist {
  grid-area: message;
}

.small_options_bottom_topiclist {
  margin-top: var(--bg);
}

.small_options_bottom_topiclist > * {
  margin-right: var(--bg) !important;
}









/*- - - - - - - - - - - - - - - - - - - - QEEL QEEL QEEL - - - - - - - - - - - - - - - - - - - -*/

.bp_qeel {
  display: grid;
  grid-gap: var(--gg);
  --gg: var(--mo);
  grid-template:
    "online  avatar  stats  recorded" var(--height-small)
    "online  avatar  infos  recorded" var(--height-fill)
    "newest  avatar  infos  recorded" var(--height-small)
    "groups  groups  groups groups" auto
  / 1fr auto 1fr 1fr;
  --height-small: 30px;
  --height-fill: 60px;
 
  font-size: 0.9rem;
  line-height: 1.2rem;
}

.bp_qeel > .small {
  padding: 3px var(--mo);
}

.bp_qeel .simple {
  margin: 0;
}

.online_qeel {
  grid-area: online;
}

.newest_qeel {
  grid-area: newest;
}

.stats_qeel {
  grid-area: stats;
}

.infos_qeel {
  grid-area: infos;
}

.recorded_qeel {
  grid-area: recorded;
}

.avatar_qeel {
  grid-area: avatar;
  border-radius: var(--main-border-radius);
  box-shadow: var(--main-box-shadow-highlight);
  overflow: hidden;
  position: relative;
}

.empty_ava_qeel {
  display: block;
  height: 100%;
}

.avatar_qeel > img:not(.empty_ava_qeel) {
  display: block;
  width: 100%;
  height: 100%;
  position: absolute;
  z-index: 200;
  top: 0;
  left: 0;
}

.groups_qeel {
  grid-area: groups;
  grid-gap: var(--gg);
  --max: 120px;
}

.groups_qeel * {
  margin: 0;
}









/*- - - - - - - - - - - - - - - - - - - - PROFIL PROFIL PROFIL - - - - - - - - - - - - - - - - - - - -*/

.bp_profil {
  display: grid;
  grid-template:
    "left center right" 320px
  / 1fr 200px 1fr;
  grid-gap: var(--sm);
}

.bp_profil .simple {
  margin-top: 0;
}

.bp_profil > * {
  margin: 0 !important;
}

.left_profil {
  display: grid;
  grid-gap: var(--sm);
  grid-template:
    "contact main" 270px
    "contact online" 1fr
    / var(--sq) 1fr;
  --sq: 30px;
}

.contact_profil {
  grid-area: contact;
}

.contact_profil img {
  display: block;
  width: var(--sq);
  height: var(--sq);
  margin-bottom: var(--mo);
}

.infos_profil {
  grid-area: main;
}

.infos_profil div:not(.invisible) {
  display: inline;
}

.online_profil {
  grid-area: online;
}

.avatar_profil {
  width: 200px;
  height: 100%;
}

.avatar_profil img {
  width: 100%;
  height: 100%;
}

.right_profil {
  display: grid;
  grid-gap: var(--sm);
  grid-template:
    "un un" 1fr
    "deux deux" 1fr
    "trois trois" 1fr
    "quatre quatre" 1fr
    "reste reste" 123px
  / 1fr 1fr;
}

.rank_profil {
  grid-area: un;
}

.posts_profil {
  grid-area: deux;
}

.participations_profil {
  grid-area: trois;
}

.messages_profil {
  grid-area: quatre;
}

.rpg_profil {
  grid-area: reste;
}

.rpg_activated_profil + .rpg_inactivated_profil {
  display: none;
}









/*- - - - - - - - - - - - - - - - - - - - MEMBERLIST - - - - - - - - - - - - - - - - - - - -*/

.bp_ml {
  display: grid;
  grid-gap: var(--mo);
  grid-template-columns: repeat(3, 1fr);
}

.nomember_ml + .bp_ml {
  display: none !important;
}

.bp_ml > * {
  margin: 0;
}

.container_ml {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.main_ml {
  display: grid;
  flex: 1 1 auto;
  grid-gap: var(--mo);
  padding: var(--mo);
  grid-template:
    "icon infos" var(--sq)
    "online online" auto
    / var(--sq) 1fr;
  --sq: 40px;
}

.icon_ml img {
  width: 100%;
  height: 100%;
}

.infos_ml {
  grid-area: infos;
 
  font-size: 0.9rem;
  line-height: 1.2rem;
}

.online_ml {
  grid-area: online;
 
  font-size: 0.9rem;
}

.online_ml a {
  flex: 0 0 auto;
}

/*in the groups panel*/

.modoption_ml input {
  width: var(--sq);
  height: var(--sq);
  --sq: 22px;
  background: var(--m1);
  border: 2px solid var(--m1);
  border-radius: 50%;
}

.modoption_ml input:hover {
  background: var(--h1);
}

.modoption_ml input:checked {
  background: var(--h2);
}









/*- - - - - - - - - - - - - - - - - - - - TOOLTIPS TOOLTIPS TOOLTIPS - - - - - - - - - - - - - - - - - - - -*/

/*inside postbody*/

a.mentiontag {
  background: var(--h1) !important;
  padding: 1px 4px !important;
  border-radius: var(--main-border-radius) !important;
 
  color: var(--l0) !important;
}

a.mentiontag:hover {
  background: var(--h4) !important;
 
  color: var(--l0) !important;
}

/*tooltip itself*/

.tooltipster-default {
  background: var(--l2) !important;
  padding: 0 !important;
  box-shadow: var(--main-box-shadow) !important;
  border: 0 !important;
 
  color: inherit !important;
  font-family: inherit !important;
  font-size: 0.9rem;
}

.bp_tooltip {
  display: grid;
  grid-gap: var(--mo);
  grid-template:
    "icon title" auto
    "icon infos" var(--sq)
    "rank rank" auto
  / var(--sq) 1fr;
  --sq: 100px;
}

.bp_tooltip .simple {
  margin: 0 !important;
}

.name_tooltip {
  grid-area: title;
  background: var(--l3) !important;
}

.avatar_tooltip {
  grid-area: icon;
}

.avatar_tooltip img {
  width: 100%;
  height: 100%;
}

.rank_tooltip {
  grid-area: rank;
  background: var(--l3) !important;
}

.displayed_rank_tooltip + .no_rank_tooltip {
  display: none;
}

.infos_tooltip {
  grid-area: infos;
 
  font-style: italic;
}

.infos_tooltip a::after {
  content: ' ';
}









/*- - - - - - - - - - - - - - - - - - - - OFFICIAL MESSAGES - - - - - - - - - - - - - - - - - - - -*/

.postbody, .postbody .content {
  font-size: 1rem;
  line-height: 1.3rem;
}

.postbody img {
  max-width: 100%;
}

.postbody .simple:first-child {
  margin-top: 0;
}

.postbody .flex, .postbody .flexrow {
  --max: 200px;
  --height: 200px;
}

.flex.ava, .flexrow.ava {
  --height: 250px;
}

.postbody .flex > *, .postbody .flexrow > * {
  height: var(--height);
}

.ava .ava {
  --width: calc(0.625 * var(--height));
  flex: 0 0 var(--width);
}

.ava .ava img {
  display: block;
  width: 100%;
  height: 100%;
}




/*----- PRESENTATION -----*/

.start_images_pres {
  height: 120px;
}

.flexrow.icons_pres {
  --height: 93px;
}

.irl_scroll_pres {
  height: auto;
  max-height: 120px;
}





/*----- FICHE DE LIENS -----*/

.resume_liens {
  height: auto !important;
  max-height: 250px;
}

Viewtopic-body

Code:

<!-- BEGIN switch_plus_menu -->
<script type="text/javascript">
   //<![CDATA[
   var multiquote_img_off = '{JS_MULTIQUOTE_IMG_OFF}', multiquote_img_on = '{JS_MULTIQUOTE_IMG_ON}';
</script>
<!-- END switch_plus_menu -->
<script type="text/javascript">

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>

<section class="bp_topic">
  <div class="simple dark highlight">
    <h2>{TOPIC_TITLE}</h2>
    <!-- BEGIN topicpagination --><pp>{PAGINATION}</pp><!-- END topicpagination -->
  </div>


  <div class="subtitle_topic">
    <!-- BEGIN switch_user_authpost -->
    <a href="{U_POST_NEW_TOPIC}" rel="nofollow"><btag>nouveau</btag></a>
    <!-- END switch_user_authpost -->

    <!-- BEGIN switch_user_authreply -->
    <a href="{U_POST_REPLY_TOPIC}"><btag>réponse</btag></a>
    <!-- END switch_user_authreply -->

    <pl class="navtree_topic"><a class="nav" href="{U_INDEX}">{L_INDEX}</a> {NAV_CAT_DESC}</pl>
  </div>
</section>

{POLL_DISPLAY}




<!-- BEGIN postrow -->
   <!-- BEGIN hidden -->
      <div class="post {postrow.hidden.ROW_COUNT}">
         <p style="text-align:center">{postrow.hidden.MESSAGE}</p>
      </div>
   <!-- END hidden -->
   <!-- BEGIN displayed -->

                <section class="bp_post" id="p{postrow.displayed.U_POST_ID}">
                  <div class="name_post simple light highlight">
                    <div style="position: relative; top: -30px; width: 1px;" id="{postrow.displayed.U_POST_ID}"></div>
                    <h3>@ {postrow.displayed.POSTER_NAME}</h3>
                  </div>

                  <div class="content_post simple light">
                    <div class="left_post" id="profile{postrow.displayed.U_POST_ID}">
                      <div class="avatar_post">
                        {postrow.displayed.POSTER_AVATAR}
                      </div>

                      <div class="rank_post simple dark highlight center-align table_js">
                        <rou>{postrow.displayed.POSTER_RANK_NEW}{postrow.displayed.RANK_IMAGE}</rou>
                      </div>

                      <qt class="profil_post">
                        <!-- BEGIN profile_field -->
                          {postrow.displayed.profile_field.LABEL}
                          {postrow.displayed.profile_field.CONTENT}
                          {postrow.displayed.profile_field.SEPARATOR}
                        <!-- END profile_field -->
                      </qt>
                    </div>




                    <div class="right_post">


                      <div class="infos_post flexrow profile-icons">
                        <div class="simple middle highlight table_js ancre_post"><a href="{postrow.displayed.POST_URL}">#</a></div>
                        <div class="simple middle lowercase table_js">
                          <ro>{postrow.displayed.POST_DATE_NEW}</ro>
                        </div>

                        <a class="option_post" onclick="{postrow.displayed.MULTIQUOTE_URL}" id="post_mq{TOPIC_ID}_{postrow.displayed.U_POST_ID}">
                          <i class="ion-quote"></i>
                          <i class="ion-ios-plus-empty"></i>
                        </a>

                        <a class="option_post" href="{postrow.displayed.QUOTE_URL}">
                          <i class="ion-quote"></i>
                        </a>

                        <a class="option_post" href="{postrow.displayed.EDIT_URL}">
                          <i class="ion-edit"></i>
                        </a>

                        <a class="option_post" href="{postrow.displayed.DELETE_URL}">
                          <i class="ion-trash-a"></i>
                        </a>

                        <a class="option_post" href="{postrow.displayed.IP_URL}">
                          <i class="ion-ios-information"></i>
                        </a>

                      </div>


                      <!-- BEGIN switch_vote_active -->
                      <div class="simple light vote">
                              <!-- BEGIN switch_vote -->
                                      <a href="{postrow.displayed.switch_vote_active.switch_vote.U_VOTE_PLUS}" class="ion-plus-circled"></a>
                              <!-- END switch_vote -->

                              <!-- BEGIN switch_vote -->
                                      <a href="{postrow.displayed.switch_vote_active.switch_vote.U_VOTE_MINUS}" class="ion-minus-circled"></a>
                              <!-- END switch_vote -->

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

                                      <div class="vote-bars">
                                              <!-- BEGIN switch_vote_plus -->
                                                      <div class="vote-bar-plus" style="width:{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="width:{postrow.displayed.switch_vote_active.switch_bar.switch_vote_minus.HEIGHT_MINUS}px;"></div>
                                              <!-- END switch_vote_minus -->
                                      </div>
                              </div>
                              <!-- END switch_bar -->

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


                      <div class="post_post postbody simple light">
                        {postrow.displayed.MESSAGE}
                      </div>

                      <!-- BEGIN switch_signature -->
                      <div class="signature_post simple light" id="sig{postrow.displayed.U_POST_ID}">
                        {postrow.displayed.SIGNATURE_NEW}
                      </div>
                      <!-- END switch_signature -->

                      <div class="contact_post">
                        <div class="contact_title_post simple dark table_js">me contacter</div>
                        {postrow.displayed.PROFILE_IMG}
                        {postrow.displayed.PM_IMG}
                        {postrow.displayed.EMAIL_IMG}
                        <!-- BEGIN contact_field -->
                                {postrow.displayed.contact_field.CONTENT}
                        <!-- END contact_field -->
                      </div>


                      <!-- BEGIN switch_attachments -->
                              <dl class="attachbox">
                                      <dt>{postrow.displayed.switch_attachments.L_ATTACHMENTS}</dt>
                                      <dd class="attachments">
                                              <!-- BEGIN switch_post_attachments -->
                                              <dl class="file">
                                                      <dt>
                                                              <img src="{postrow.displayed.switch_attachments.switch_post_attachments.U_IMG}" alt=""/>
                                                      </dt>
                                                      <dd>
                                                              <!-- BEGIN switch_dl_att -->
                                                              <span><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}</span>
                                                              <!-- END switch_dl_att -->

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

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

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

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

<br>

<div class="topic-actions bottom">
   <!-- BEGIN topicpagination -->
      <div class="pagination">
         {PAGINATION}
      </div>
   <!-- END topicpagination -->

   <div class="topic-actions-buttons">
      <!-- BEGIN switch_user_logged_in -->
         <!-- BEGIN watchtopic -->
            {S_WATCH_TOPIC}
         <!-- END watchtopic -->
      <!-- END switch_user_logged_in -->

      <!-- BEGIN switch_user_authpost -->
         <a href="{U_POST_NEW_TOPIC}" rel="nofollow" class="ion-edit button1">nouveau</a>
      <!-- END switch_user_authpost -->
      <!-- BEGIN switch_user_authreply -->
         <a href="{U_POST_REPLY_TOPIC}" class="ion-reply button1">réponse</a>
      <!-- END switch_user_authreply -->
   </div>
</div>

<!-- BEGIN promot_trafic -->
   <div class="block" id="ptrafic_close" style="display: none;">
      <div class="h3"><a href="javascript:ShowHideLayer('ptrafic_open','ptrafic_close');"><i class="ion-ios-plus-outline"></i></a>{PROMOT_TRAFIC_TITLE}</div>
   </div>
   <div class="block" id="ptrafic_open" style="display:'';">
      <div class="h3"><a href="javascript:ShowHideLayer('ptrafic_open','ptrafic_close');"><i class="ion-ios-minus-outline"></i></a>{PROMOT_TRAFIC_TITLE}</div>
      <ul class="ptrafic">
         <!-- BEGIN link -->
            <li>
               <a href="{promot_trafic.link.U_HREF}" target="_blank" title="{promot_trafic.link.TITLE}" rel="nofollow">
                  <i class="ion-ios-chatbubble-outline"></i>{promot_trafic.link.TITLE}
               </a>
            </li>
         <!-- END link -->
      </ul>
   </div>
<!-- END promot_trafic -->

<!-- BEGIN switch_forum_rules -->
<div class="post row1" id="forum_rules">
   <div class="h3">{L_FORUM_RULES}</div>
   <div class="clear"></div>
   <table class="postbody">
      <tr>
         <!-- BEGIN switch_forum_rule_image -->
         <td class="logo">
            <img src="{RULE_IMG_URL}" alt="" />
         </td>
         <!-- END switch_forum_rule_image -->
         <td class="rules content">
            {RULE_MSG}
         </td>
      </tr>
   </table>
</div>
<!-- END switch_forum_rules -->

<!-- BEGIN switch_user_logged_in -->
   <a name="quickreply"></a>
     <div class="quick_reply_topic">{QUICK_REPLY_FORM}</div>
<!-- END switch_user_logged_in -->






<div class="options_topic flex simple light">

        <!-- BEGIN viewtopic_bottom -->
        <div>
          <form method="get" action="{S_FORM_MOD_ACTION}">
            <fieldset class="quickmod left-align">
            <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}" />
              <label>{L_MOD_TOOLS}:</label>
              {S_SELECT_MOD}
              <input class="button2 goto_topic" type="submit" value="{L_GO}" />
            </fieldset>
          </form>

          <p class="left-align">{S_TOPIC_ADMIN}</p>
        </div>
        <!-- END viewtopic_bottom -->

        <form action="{S_JUMPBOX_ACTION}" method="get" onsubmit="if(document.jumpbox.f.value == -1){return false;}">
          <fieldset class="jumpbox left-align">
            <label>{L_JUMP_TO}:</label>
            {S_JUMPBOX_SELECT}
            <input class="button2 goto_topic" type="submit" value="{L_GO}" />
          </fieldset>
        </form>


        <!-- BEGIN show_permissions -->
        <div>
          <h4>permissions de ce forum</h4>
          {S_AUTH_LIST}
        </div>
        <!-- END show_permissions -->

</div>

<div class="simple light lowercase">
  <pl><a class="nav" href="{U_INDEX}">{L_INDEX}</a> {NAV_CAT_DESC}</pl>
</div>






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

<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.9.0/styles/github-gist.min.css">
<script src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.9.0/highlight.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.9.0/languages/go.min.js"></script>
<script>
$(document).ready(function() {
   $('pre, code').each(function(i, block) {
      hljs.highlightBlock(block);
   });

   $('.post').each(function() {
      if (!$(this).find('.postprofile-avatar').html().length) {
         $(this).find('.postprofile-rank').css('border-bottom', 'none');
         $(this).find('.postprofile > dl > dt').css('min-height', $(this).find('.post-head').innerHeight());
      }
   });
});
</script>

[Toryudo]

Bonjour !

Quand vous configurez un champ dans le profil, vous avez un donnée qui s'appelle "Séparateur" :



En fonction de ce que vous avez choisi, il y a un élément (retour à la ligne, rien, saut de ligne ou séparateur), qui apparait sous le champ. Chez vous, c'est un élément img (une image de 1x1 pixels) qui sépare message et âge. Cet élément img est affecté par le CSS suivant :

Code:

.left_post img {
  width: 100%;
  height: 100%;
}

L'image est donc agrandie avec toute la place qu'elle peut prendre, soit 127 x 127 pixels, d'où le gros espace vide.
Deux solutions :
- changer le Séparateur du champ message (pour mettre "aucun" par exemple)
- affiner le CSS pour qu'il ne touche pas à cette image séparatrice

Si vous voulez juste appliquer ce CSS à l'avatar par exemple, préférez :

Code:

.left_post .avatar_post img {
  width: 100%;
  height: 100%;
}

[Argimpasa]

Bonjour,
Désolée du retard de réponse.
Alors j'avais déjà mis retour à la ligne, et là en changeant en "aucun", je n'ai aucune différence.
Toutefois la seconde solution, et donc en modifiant le CSS, me permet de ne plus avoir cet écart.
Je vous remercie sincèrement.

[Toryudo]

Bonjour !
Je vous en prie !

Afin de faciliter la gestion des problèmes, si le vôtre est résolu, pensez à : éditer votre premier message, cocher l'icône résolu et enregistrer Vous pouvez également remercier les personnes qui vous ont aidé, en cliquant sur le bouton

[Chacha]

Bonjour, Attention, cela fait 6 jours que nous n'avons pas de nouvelles concernant votre demande, si vous ne voulez pas voir votre sujet déplacé à la corbeille, merci de poster dans les 24h qui suivent ce message. Si votre sujet est résolu, merci d'éditer votre premier message et de cocher l'icône « résolu »

[Chacha]

Bonjour, Nous n'avons plus de nouvelle de l'auteur de ce sujet depuis plus de 7 jours. Nous considérons donc ce problème comme résolu ou abandonné. La prochaine fois, merci de nous tenir au courant de l'évolution de votre problème, ou pensez à faire un UP régulièrement ! Ce sujet est archivé afin de ne pas perdre les réponses apportées.