Problème de spoiler décalé

[Menoch]

Mon problème est exactement le même que celui exposé dans ce sujet, sauf que les solutions proposées n'ont pas marché pour mon cas :/ . Quand j'ai plusieurs spoilers dans le même sujet, ils se décalent comme s'ils étaient "listés".

Illustration :

Spoiler:

Voici ma feuille de style :

Code:

/* JUSTIFICATION, MARGE */

        .postbody {
        display: block;
        padding-left: 15px;
        padding-right: 15px;
        text-align:justify;
        }

/* BANNIERE CONTRE FOND */

        #i_logo {
        margin-left:-10px;
        margin-right:-10px;
        margin-top:-10px;
        margin-bottom:-30px;}

/* MARGE HAUT, BAS */
       
.bodyline{
border-top: none !important;
border-bottom: none !important;
}
body {
margin: 0 auto;
}

/* épaisseur de bordure et suppr bordure haut */
.bodyline
        {border-left: 10px #A1907F solid;
        border-right: 10px #A1907F solid;}



/* RECADRAGE HAUT DU FORUM + BORDURE COLLE */
table.bodylinewidth
{
position: relative;
top: -9px;
}

/* PSEUDO */
.post .name
{
  font-family: 'Morpheus'; 'Times New Roman' ;
  font-size: 20px;
  text-transform: uppercase;
  }

A:link {text-decoration: none !important;}
A:visited {text-decoration: none !important;}
A:active {text-decoration: none !important;}
A:hover {text-decoration: none !important;}

/*


/* LETTRINE */
.lettrine {
float: left;
font-size : 60px;
padding-top : 10px;
margin-bottom : 4px;
margin-right : 14px;
font-family:'HP PSG'; 'Arial Black' ;
 
}

.lettrine2 {
float: left;
font-size: 60px;
padding-top: 17px;
margin-bottom: 2px;
border: 5px solid #efd8a7;
width: 60px;
margin-right : 14px;
background-image: url('http://obsession27.free.fr/divers/fonds/pro.jpg');
text-align: center; 
font-family:'HP PSG'; 'Arial Black' ;
color: #darkred;
height: 40px;
 
}


.lettrine3 {
float: left;
font-size: 60px;
padding-top: 17px;
margin-bottom: 2px;
border: 5px solid #e6cc84;
width: 60px;
margin-right : 14px;
background-image: url('http://obsession27.free.fr/divers/fonds/paf8.jpg');
text-align: center; 
font-family:'HP PSG'; 'Arial Black' ;
color: #e6cc84;
height: 40px;
 
}


/* liens degrade de couleur */
a {
          -webkit-transition: all 0.6s ease-in;
          -moz-transition: all 0.6s ease-in;
          -ms-transition: all 0.6s ease-in
          -o-transition: all .06s ease-in;
          transition: all 0.6s ease-in;
        }
 

/* INFO PROFIL */

/* Code par Hiro pour CSSACTIF
  Merci de ne pas supprimer cette mention
  (http://www.css-actif.com) */

#englob { /* Encadrement global des 2 divs */
    position:relative;
    width:200px;
    height:320px;
    border:3px solid #655a4e; /* bordure avatar */
    overflow:relative; /* Permet de cacher ce qui dépasse */
}

.imgp {
    background:#857667; /* le bg  de la div qui contient l'avatar */
    position:absolute; /* Laissez comme ceci */
    top:0;/* Laissez comme ceci */
    left:0;/* Laissez comme ceci */
    width:100%;/* Laissez comme ceci */
    height:100%;/* Laissez comme ceci */
    z-index:0;/* La position par rapport à l'autre div qui contient les infos */
    -webkit-transition:all 0.8s;/* Laissez comme ceci */
    -moz-transition:all 0.8s;/* Laissez comme ceci */
    -o-transition:all 0.8s;/* Laissez comme ceci */
    -ms-transition:all 0.8s;/* Laissez comme ceci */
    transition:all 0.8s;/* Laissez comme ceci */
}

#englob:hover > .infosp {
    margin-right:200px; /* Lorsque la souris passe sur la div #englob, on fait glisser l'image vers le bas de 200px */
}

.infosp {
    background:#655a4e; /* le bg  de la div qui contient les infos*/
    position:absolute;/* Laissez comme ceci */
    top:0;/* Laissez comme ceci */
    left:0;/* Laissez comme ceci */
    width:100%;/* Laissez comme ceci */
    height:100%;/* Laissez comme ceci */
    z-index:1;/* La position par rapport à l'autre div qui contient les infos (ici en dessous)*/
    opacity:0;/* on met l'opacité à zero pour un effet stylé ;) */
    margin-left:-200px;/* on décale la div de 200px, elle est invisible grâce a l'overflow:hidden de #englob */
    -webkit-transition:all 0.8s;/* Laissez comme ceci */
    -moz-transition:all 0.8s;/* Laissez comme ceci */
    -o-transition:all 0.8s;/* Laissez comme ceci */
    -ms-transition:all 0.8s;/* Laissez comme ceci */
    transition:all 0.8s;/* Laissez comme ceci */
}

#englob:hover > .infosp {
  opacity:1;/* Lorsque la souris passe sur la div #englob, on augmente l'opacité des infos */
  margin-left:0px;/* et on décale cette div à 0px (position par défaut) */
}


/* TABLEAU PARTENAIRE BY ORANGE */
div.cssactif_tableaupartenaire {
  width: 400px; /* À adapter en fonction du nombre de colonnes désirées (typiquement: (NOMBRE_COLONNE * (2*MARGE)) + (4 * Largeur initiale) */
  line-height: 0px; /* À ne pas modifier */
}

div.cssactif_tableaupartenaire a {
 margin: 5px; /* MARGE entre les images */
   
}

div.cssactif_tableaupartenaire a, div.cssactif_tableaupartenaire a img {
  display:inline-block;  /* À ne pas modifier */
  height: 18px; /* Hauteur initiale */
  width: 50px; /* Largeur initiale */
 
 

}

div.cssactif_tableaupartenaire a:hover img {
  display:inline-block;  /* À ne pas modifier */
  position: absolute; /* Permet de ne pas décaler les autres images */
  height: 35px; /* Hauteur finale (possibilité de mettre 100% si images de différentes tailles )*/
  width: 100px; /* Largeur finale (possibilité de mettre 100% si images de différentes tailles) */
 
  /* Transitions pour différents navigateur */
  /* navigateur: toutes_transitions durée type */
  -webkit-transition:  width 1s, height 1s;
  -moz-transition: 0.2s linear;
  -ms-transition: 0.2s linear;
  -o-transition: 0.2s linear;
  transition: 0.2s linear;
 
  /* Facultatif: positionne le logo de pleine taille au centre - À adapter */
    margin-left: -19px;
  margin-top: -6px;
}

/* ---- FIN DU TABLEAU PARTENAIRE ---- */

/* IMAGE DE FOND DERNIER MESSAGE */
.deco_sujet {
        background: url('http://i50.tinypic.com/2582vth.png');
        background-repeat: no-repeat;
        align:center;     
        valign:middle;
        }

/* COLONNE DERNIER MESSAGE */
.lastpost{
    padding: 2px;
    font-family: verdana;
    font-size: 9px;
    color: #000;
    text-decoration: none;
    margin-left: 7px;
    margin-right: 15px;
    margin-top: 8px;

}

/* SANS FOND DERNIERS CONNECTES */
.conneclast . row1 {
        moz-border-radius: 0px;
        width : 100%;
        }

/* GROUPES */
.groupes {
    font-family: 'Morpheus'; 'Times New Roman' ;
    font-size: 12px;
    text-shadow: #d2c5ac 1px 1px 1px;
          }


/* MEMBRES 12h TRANSPARENT */
.trans .row1 {
        background-color: 'transparent';
        }


/* SUPPR DERNIERE EDITION*/
tr.post span.gensmall { display: none; }

/* TITRE CATEGORIES */
.secondarytitle h2 {
        text-transform: uppercase;
        font-size : 15px;
        }


/* SPOILER */
.spoiler_content
{
background: url(http://obsession27.free.fr/divers/fonds/ta14.jpg) repeat ;
color:#bfbcac;
padding:5px 10px 5px 10px;
font-family:georgia;
font-size:11px;
border: 1px solid #602424;
-webkit-border-radius: 8px;
-moz-border-radius: 8px;
border-radius: 8px;
}



.spoiler_closed
{
background: url(http://i49.tinypic.com/2cpdv6c.png) no-repeat transparent;
color:transparent;
padding:5px 10px 5px 10px;
height: 69px
font-size:14px;
border: 1px solid transparent;
-webkit-border-radius: 8px;
-moz-border-radius: 8px;
border-radius: 8px;

}


/* CITATIONS */
.quote
{
background: url(http://obsession27.free.fr/divers/fonds/ta14.jpg) repeat ;
color:#bfbcac;
padding:5px 10px 5px 10px;
font-family:georgia;
font-size:11px;
border: 1px solid #602424;
-webkit-border-radius: 8px;
-moz-border-radius: 8px;
border-radius: 8px;

}

/* CODE */
.code
{
background: url(http://obsession27.free.fr/divers/fonds/ta14.jpg) repeat ;
color:#bfbcac;
padding:5px 10px 5px 10px;
font-family:georgia;
font-size:11px;
border: 1px solid #602424;
-webkit-border-radius: 8px;
-moz-border-radius: 8px;
border-radius: 8px;

}


Merci à ceux/celles qui pourront éclairer ma chandelle <3

[Dr. Sam]

Bonjour,

Je vais tenter de vous aider... Par contre est-ce que je pourrais avoir le lien de votre forum s'il vous plait ? Car il me semble que c'est pas le même exposé sur votre profil !

[Menoch]

oui bien sûr, voilà : http://kingscross.forumactif.com/

Il y a effectivement eu du changement, je n'avais pas pensé à mettre à jour mon profil. Excellente remarque.

[Menoch]

UP

[Menoch]

up

[Menoch]

up

[Menoch]

up

[Menoch]

up

[Invité]

Bonjour,

Dans votre CSS, remplacez:

Code:

/* JUSTIFICATION, MARGE */

        .postbody {
        display: block;
        padding-left: 15px;
        padding-right: 15px;
        text-align:justify;
        }

par:

Code:

/* JUSTIFICATION, MARGE */

        div.postbody {
        display: block;
        padding-left: 15px;
        padding-right: 15px;
        text-align:justify;
        }

Bien sincèrement.

[Menoch]

Bien vu. Je te remercie ça marche nickel.