Pb avec limitation longueur des citations

[Didou57]

Détails techniques

Version du forum : phpBB3
Poste occupé : Administrateur
Navigateur(s) concerné(s) : Opera
Personnes concernées par le problème : Tous les utilisateurs
Problème apparu depuis : 13 novembre 2019
Lien du forum : http://goldwing.lebonforum.com/

Description du problème

Bonjour,

J'ai installé les codes de l'astuce concernant la limitation des citations sur mon forum mais lorsqu'on clique sur le lien "continuer la lecture", il ne se passe rien.

https://forum.forumactif.com/t391402-limiter-la-longueur-des-citations

Y a-t-il un paramètre à modifier ?
A savoir que ça ne fonctionne pas non plus sur Chrome et sur l'Ipad de mon épouse.

D'avance merci pour vos avis.

[Faline]

Bonjour,

Chez moi (= sur mon forum), le script fonctionne bien, mais je n'arrive pas à revenir en arrière, de rétrécir de nouveau comme pour un spoiler... Mais ce n'est visiblement pas prévu par le script.

Je suis en phpbb2. Navigateurs testés : Safari et Vivaldi sur Macbook.

Mais sur ton forum je n'y arrive effectivement pas sur le message
https://www.goldwingpartage.com/t11069-quelques-accessoires-pour-les-golds-2018#202559
Le message est-il réellement encore plus long ou n'y a-t-il simplement pas plus de texte à voir ?

As-tu un autre script, avec lequel il risque d'y avoir interférence, p. ex. un autre script qui porte aussi sur les citations ?

Pour dépanner, tu pourrais mettre dans le CSS

Code:

overflow:scroll;

à la place de

Code:

overflow:hidden;

Remarque : il manque une version avec le cas pour Awesomebb. Le tutoriel n'est donc plus toutes versions.

[Didou57]

Bonsoir,

Merci pour cette réponse, et je n'ai pas d'autre script concernant les citations.
L'astuce date de 2017. Il est vrai qu'à l'époque les forums n'étaient pas en https mais est-ce que ça joue vraiment ?

J'ai fait un essai avec un long texte au hasard dans un sujet et ça n'a pas raccourci le texte....   donc forcément, lorsqu'on clique sur le lien, il ne se passe rien. Je dois avoir un soucis avec mon navigateur. Si vous avez une piste, je suis preneur.

[Faline]

Comme le lien en http est en commentaire, il n'a pas d'influence sur le fonctionnement du script.

Serait-il possible d'avoir un lien vers une citation suffisamment longue pour déclencher le script à coup sûr ? Le message que j'ai mentionné ci-dessus n'est peut-être pas assez long. Ou veux-tu que je mette mon propre message test dans la zone invités pour que tu puisses essayer si c'est ton navigateur qui foire ?

[Didou57]

je vois que les citations sont limitées à 400px de hauteur. Ne faudrait-il pas modifier cette valeur ? ou une autre, soit dans le Javascript, soit dans le CSS ? 

J'ai refais le test sur un texte de 34 lignes (espaces compris) et rien ne change. 

Le texte de Denis

https://www.goldwingpartage.com/t11152p30-achat-dun-maxi-trail-pour-faire-le-maroc

[Faline]

Effectivement, ça ne marche pas. Je t'ai mis ma version à moi pour voir si tu arrives à ouvrir le texte, en scroll pour vérification, mais cela ne change rien au principe.

Tu peux bien sûr changer la hauteur, mais cela ne changera rien au fonctionnement. Dans un premier temps je prendrais exactement les codes du tuto jusqu'à ce que ça marche, puis étape par étape apporter d'éventuelles modifications.

[Didou57]

Bonsoir,

Petit up du sujet au cas où quelqu'un aurait une idée ?

[*Splash*]

Hi,
Je viens d'installer cette astuce sur mon forum test phpBB3, lien ici :
https://rwan.forumactif.com/t379-test-de-limitation-des-citations#502

Tout est OK

Didou57, comment as-tu placé le script ?

[Didou57]

Bonsoir,

Merci pour l'aide. J'ai suivi les indications du tuto, je crois, créé le nouveau javascript puis collé le code au bas de la page du CSS. 

Je viens de faire un test sur mon forum en me postant dans ma partie modération le long texte en latin (?) mais le système ne fonctionne pas, le texte n'est pas réduit.

[*Splash*]

Tu as bien placé le script sur les sujets ?
Ensuite il peut s'agir d'un bug avec un autre script, essaie de désactiver les scripts présents sur ton forum, ceux placés sur les sujets pour commencer, en le laissant que celui de la limitation de citation

[Didou57]

Voila, j'ai désactivé tous les javascript qui étaient sur les sujets, revalidé le tout et rafraichit mon forum mais ça marche pô... 

[*Splash*]

OK, tu peux mettre ici le script et le CSS que tu as placé sur ton forum ?

[*Splash*]

Cette partie du CSS semble absente sur ton forum :

Code:

a.fa-quote-expand {
    background-color: #fff;
    border: 1px #999 solid;
    bottom: 15px;
    color: inherit;
    display: none;
    height: 30px;
    left: 50%;
    line-height: 30px;
    margin-left: -75px;
    position: absolute;
    text-align: center;
    text-decoration: none;
    width: 150px;
    z-index: 1;
}

OK, en supprimant le code CSS sur mon forum je reproduis le problème que tu as.
Donc place ce code CSS sur ton forum :

Code:

/** BEGIN Quote Collapse */
.fa-quote-collapsed {
  display:block;
  height:200px;
  overflow:scroll;
  position:relative;
}
a.fa-quote-expand {
  display:none;
  position:absolute;
  z-index:1;
  left:50%;
  width:150px;
  margin-left:-75px;
  height:30px;
  line-height:30px;
  bottom:15px;
  text-align:center;
  text-decoration:none;
  color:inherit;
  background-color:#fff;
  border:1px #999 solid;
}
.fa-quote-collapsed a.fa-quote-expand {
  display: block;
}
/** END Quote Collapse */

[Didou57]

C'est une partie manquante pour le code en question ?

[*Splash*]

Ceci est le code CSS associé à l'astuce :

Code:

/** BEGIN Quote Collapse */
.fa-quote-collapsed {
  display:block;
  height:200px;
  overflow:scroll;
  position:relative;
}
a.fa-quote-expand {
  display:none;
  position:absolute;
  z-index:1;
  left:50%;
  width:150px;
  margin-left:-75px;
  height:30px;
  line-height:30px;
  bottom:15px;
  text-align:center;
  text-decoration:none;
  color:inherit;
  background-color:#fff;
  border:1px #999 solid;
}
.fa-quote-collapsed a.fa-quote-expand {
  display: block;
}
/** END Quote Collapse */

Ce code semble absent sur ton forum

[Didou57]

j'ai collé ton code mais ça fonctionne pas...

[*Splash*]

Désolé, sur ton forum il n'y a pas le code CSS




Voici un screen fait sur mon forum



Le code CSS figure bien

Où colles-tu le code CSS ?

[Didou57]

je colle le code au bas de la feuille de style CSS. Je commence à comprendre que je le mets pas au bon endroit ?

[*Splash*]

Tu peux mettre ici le contenu de ta CSS ?

[Didou57]

Code:

input[name=hideonline] { display: none; }
body {
    l(https://sd-1.archive-host.com/membres/up/132720629421430912/FDF/Decoration/Noel/santa2.cur), auto;
}#navMP>a{
  display:inline-block;
  padding-left:10px;
  padding-right:10px;
  font-size:16px;
  line-height:16px;
  color:#eee;
  background:#BDC8D0;
  text-decoration:none !important;
  border:1px solid #aaa;
}.boutonbas {
        position: fixed;
        bottom: 300px;
        right: 02px;  
       
        }.boutonhaut {
        position: fixed;
        top: 480px;
        right: 02px; 
 
      }
#navMP>a:hover{
  color:#fff;
  background:#CDD8E0;
  text-decoration:none !important;
}
#navMP-precedent{
  border-radius:8px 0 0 8px;
}
#navMP-suivant{
  float:right;
  border-radius:0 8px 8px 0;
}
 
#navMP-precedent::before{
  content:"Précédent"
}
#navMP-suivant::before{
  content:"Suivant"
}
.signature_div img{
            max-width: 500px !important;
            max-height: 200px !important;
            }
        dl.annonce {background-color:#C5FFCA;} /* Modifie la couleur de fond des annonces */
        dl.post-it {background-color:#CAC5FF;} /* Modifie la couleur de fond des post-it */
        .fa_avatar {
          width: 25px;
          height: 25px;
          position: relative;
          top: -3px;
          margin-right: 5px;
          border-radius: 3px;
          margin-bottom: -10px;
        }
                 span.new-message { color: orange; }
#clignote {
.fa_avatar {
  width: 25px;
  height: 25px;
  position: relative;
  top: -3px;
  margin-right: 5px;
  border-radius: 3px;
  margin-bottom: -10px;
}
  .navbar ul{
background-color: #e5f1f9;
}
text-decoration: 
 blink;
}
#navMP>a{
  display:inline-block;
  padding-left:10px;
  padding-right:10px;
  font-size:16px;
  line-height:16px;
  color:#eee;
  background:#BDC8D0;
  text-decoration:none !important;
  border:1px solid #aaa;
}
#navMP>a:hover{
  color:#fff;
  background:#CDD8E0;
  text-decoration:none !important;
}
#navMP-precedent{
  border-radius:8px 0 0 8px;
}
#navMP-suivant{
  float:right;
  border-radius:0 8px 8px 0;
}
 
#navMP-precedent::before{
  content:"Précédent"
}
#navMP-suivant::before{
  content:"Suivant"
}
                 input[name=hideonline] {
                  display:none;
                }blink {
          visibility: expression((function(){
          if (!window.IEBlink) {
          window.IEBlink = "visible";
          setInterval(function() {
          window.IEBlink = (window.IEBlink=="visible"?"hidden":"visible");
          var blinks = document.getElementsByTagName("blink");
          for (var i=0; i < blinks.length; i++) { blinks[i].style.visibility=window.IEBlink; }
          }, 700)
          }
          return "";
          })());
        }
/* sticky nav main */
#fa_sticky_nav {
  font-size:0; /* hide whitespace */
  text-align:center;
  background:#FAFAFA;
  border-bottom:1px solid #CCC !important;
  height:30px;
  position:fixed;
  right:0;
  z-index:999;
  overflow:hidden;
  transition:top 200ms linear, width 600ms ease-in-out;
}
 
#fa_sticky_nav li { display:inline } /* navlist adjustment */
 
 
/* sticky menu links */
#fa_sticky_nav a.mainmenu {
  color:#39C;
  font-size:12px;
  font-weight:bold;
  font-family:"Trebuchet MS", Arial, Verdana, Sans-serif;
  background:url('https://i.servimg.com/u/f18/18/45/41/65/nav10.png') repeat-x 0px 30px;
  display:inline-block;
  padding:0 10px;
  height:30px;
  line-height:30px;
  transition:200ms;
}
 
#fa_sticky_nav a.mainmenu:hover, #fa_sticky_nav a.mainmenu.fa_navactif {
  background-position:0 25px;
}
 
 
/* sticky nav toggler */
#fa_sticky_toggle {
  background:url('https://i.servimg.com/u/f21/18/21/41/30/omnibo10.png') no-repeat 0 0 #FAFAFA;
  border:1px solid #CCC;
  border-right:none;
  display:inline-block;
  height:29px;
  width:30px;
  position:fixed;
  right:0;
  z-index:999;
  transition:top 200ms linear;
}
 
#fa_sticky_toggle:hover { background-position:-30px 0 }
 
 
/* make hidden toolbar similar to toggler */
#fa_toolbar_hidden {
  border-radius:0 !important;
  border:1px solid #CCC;
  border-right:0;
  border-top:0;
}
 
 
/* post offset fix */
.post div[style*="-30px;"] {
  top:-60px !important;
}
#navMP>a{
  display:inline-block;
  padding-left:10px;
  padding-right:10px;
  font-size:16px;
  line-height:16px;
  color:#eee;
  background:#BDC8D0;
  text-decoration:none !important;
  border:1px solid #aaa;
}
#navMP>a:hover{
  color:#fff;
  background:#CDD8E0;
  text-decoration:none !important;
}
#navMP-precedent{
  border-radius:8px 0 0 8px;
}
#navMP-suivant{
  float:right;
  border-radius:0 8px 8px 0;
}
 
#navMP-precedent::before{
  content:"Précédent"
}
#navMP-suivant::before{
  content:"Suivant"
}
input[name=hideonline] {
  display: none;
  }.bouhautbas {
    bottom: 40px;
    left: 10px; /* remplacez left par right pour afficher les boutons à droite */
    position: fixed;
    z-index: 100;
}.haut
{
position:fixed;
margin-top:25%;
}.bas
{
position:fixed;
margin-top:28%;
}    
input[name=hideonline] { display: none; }  

/** BEGIN Quote Collapse */
.fa-quote-collapsed {
  display:block;
  height:200px;
  overflow:scroll;
  position:relative;
}
a.fa-quote-expand {
  display:none;
  position:absolute;
  z-index:1;
  left:50%;
  width:150px;
  margin-left:-75px;
  height:30px;
  line-height:30px;
  bottom:15px;
  text-align:center;
  text-decoration:none;
  color:inherit;
  background-color:#fff;
  border:1px #999 solid;
}
.fa-quote-collapsed a.fa-quote-expand {
  display: block;
}
/** END Quote Collapse */

[*Splash*]

Entre balise codes c'est mieux !!!

Code:

input[name=hideonline] { display: none; }
body {
    l(https://sd-1.archive-host.com/membres/up/132720629421430912/FDF/Decoration/Noel/santa2.cur), auto;
}#navMP>a{
  display:inline-block;
  padding-left:10px;
  padding-right:10px;
  font-size:16px;
  line-height:16px;
  color:#eee;
  background:#BDC8D0;
  text-decoration:none !important;
  border:1px solid #aaa;
}.boutonbas {
        position: fixed;
        bottom: 300px;
        right: 02px; 
     
        }.boutonhaut {
        position: fixed;
        top: 480px;
        right: 02px;
 
      }
#navMP>a:hover{
  color:#fff;
  background:#CDD8E0;
  text-decoration:none !important;
}
#navMP-precedent{
  border-radius:8px 0 0 8px;
}
#navMP-suivant{
  float:right;
  border-radius:0 8px 8px 0;
}
 
#navMP-precedent::before{
  content:"Précédent"
}
#navMP-suivant::before{
  content:"Suivant"
}
.signature_div img{
            max-width: 500px !important;
            max-height: 200px !important;
            }
        dl.annonce {background-color:#C5FFCA;} /* Modifie la couleur de fond des annonces */
        dl.post-it {background-color:#CAC5FF;} /* Modifie la couleur de fond des post-it */
        .fa_avatar {
          width: 25px;
          height: 25px;
          position: relative;
          top: -3px;
          margin-right: 5px;
          border-radius: 3px;
          margin-bottom: -10px;
        }
                span.new-message { color: orange; }
#clignote {
.fa_avatar {
  width: 25px;
  height: 25px;
  position: relative;
  top: -3px;
  margin-right: 5px;
  border-radius: 3px;
  margin-bottom: -10px;
}
  .navbar ul{
background-color: #e5f1f9;
}
text-decoration:
 blink;
}
#navMP>a{
  display:inline-block;
  padding-left:10px;
  padding-right:10px;
  font-size:16px;
  line-height:16px;
  color:#eee;
  background:#BDC8D0;
  text-decoration:none !important;
  border:1px solid #aaa;
}
#navMP>a:hover{
  color:#fff;
  background:#CDD8E0;
  text-decoration:none !important;
}
#navMP-precedent{
  border-radius:8px 0 0 8px;
}
#navMP-suivant{
  float:right;
  border-radius:0 8px 8px 0;
}
 
#navMP-precedent::before{
  content:"Précédent"
}
#navMP-suivant::before{
  content:"Suivant"
}
                input[name=hideonline] {
                  display:none;
                }blink {
          visibility: expres​sion((function(){
          if (!window.IEBlink) {
          window.IEBlink = "visible";
          setInterval(function() {
          window.IEBlink = (window.IEBlink=="visible"?"hidden":"visible");
          var blinks = document.getElementsByTagName("blink");
          for (var i=0; i < blinks.length; i++) { blinks[i].style.visibility=window.IEBlink; }
          }, 700)
          }
          return "";
          })());
        }
/* sticky nav main */
#fa_sticky_nav {
  font-size:0; /* hide whitespace */
  text-align:center;
  background:#FAFAFA;
  border-bottom:1px solid #CCC !important;
  height:30px;
  position:fixed;
  right:0;
  z-index:999;
  overflow:hidden;
  transition:top 200ms linear, width 600ms ease-in-out;
}
 
#fa_sticky_nav li { display:inline } /* navlist adjustment */
 
 
/* sticky menu links */
#fa_sticky_nav a.mainmenu {
  color:#39C;
  font-size:12px;
  font-weight:bold;
  font-family:"Trebuchet MS", Arial, Verdana, Sans-serif;
  background:url('https://i.servimg.com/u/f18/18/45/41/65/nav10.png') repeat-x 0px 30px;
  display:inline-block;
  padding:0 10px;
  height:30px;
  line-height:30px;
  transition:200ms;
}
 
#fa_sticky_nav a.mainmenu:hover, #fa_sticky_nav a.mainmenu.fa_navactif {
  background-position:0 25px;
}
 
 
/* sticky nav toggler */
#fa_sticky_toggle {
  background:url('https://i.servimg.com/u/f21/18/21/41/30/omnibo10.png') no-repeat 0 0 #FAFAFA;
  border:1px solid #CCC;
  border-right:none;
  display:inline-block;
  height:29px;
  width:30px;
  position:fixed;
  right:0;
  z-index:999;
  transition:top 200ms linear;
}
 
#fa_sticky_toggle:hover { background-position:-30px 0 }
 
 
/* make hidden toolbar similar to toggler */
#fa_toolbar_hidden {
  border-radius:0 !important;
  border:1px solid #CCC;
  border-right:0;
  border-top:0;
}
 
 
/* post offset fix */
.post div[style*="-30px;"] {
  top:-60px !important;
}
#navMP>a{
  display:inline-block;
  padding-left:10px;
  padding-right:10px;
  font-size:16px;
  line-height:16px;
  color:#eee;
  background:#BDC8D0;
  text-decoration:none !important;
  border:1px solid #aaa;
}
#navMP>a:hover{
  color:#fff;
  background:#CDD8E0;
  text-decoration:none !important;
}
#navMP-precedent{
  border-radius:8px 0 0 8px;
}
#navMP-suivant{
  float:right;
  border-radius:0 8px 8px 0;
}
 
#navMP-precedent::before{
  content:"Précédent"
}
#navMP-suivant::before{
  content:"Suivant"
}
input[name=hideonline] {
  display: none;
  }.bouhautbas {
    bottom: 40px;
    left: 10px; /* remplacez left par right pour afficher les boutons à droite */
    position: fixed;
    z-index: 100;
}.haut
{
position:fixed;
margin-top:25%;
}.bas
{
position:fixed;
margin-top:28%;
}   
input[name=hideonline] { display: none; } 

/** BEGIN Quote Collapse */
.fa-quote-collapsed {
  display:block;
  height:200px;
  overflow:scroll;
  position:relative;
}
a.fa-quote-expand {
  display:none;
  position:absolute;
  z-index:1;
  left:50%;
  width:150px;
  margin-left:-75px;
  height:30px;
  line-height:30px;
  bottom:15px;
  text-align:center;
  text-decoration:none;
  color:inherit;
  background-color:#fff;
  border:1px #999 solid;
}
.fa-quote-collapsed a.fa-quote-expand {
  display: block;
}
/** END Quote Collapse */

[Didou57]

Sans doute, mais je ne sais pas tout faire... 

[*Splash*]

Pour une raison que j'ignore avec le code en bas de CSS cela ne fonctionne pas. Place le tout en haut de ta CSS

Ou remplace ta CSS par celle-ci :

Code:

/** BEGIN Quote Collapse */
.fa-quote-collapsed {
  display:block;
  height:200px;
  overflow:scroll;
  position:relative;
}
a.fa-quote-expand {
  display:none;
  position:absolute;
  z-index:1;
  left:50%;
  width:150px;
  margin-left:-75px;
  height:30px;
  line-height:30px;
  bottom:15px;
  text-align:center;
  text-decoration:none;
  color:inherit;
  background-color:#fff;
  border:1px #999 solid;
}
.fa-quote-collapsed a.fa-quote-expand {
  display: block;
}
/** END Quote Collapse */

input[name=hideonline] { display: none; }
body {
    l(https://sd-1.archive-host.com/membres/up/132720629421430912/FDF/Decoration/Noel/santa2.cur), auto;
}#navMP>a{
  display:inline-block;
  padding-left:10px;
  padding-right:10px;
  font-size:16px;
  line-height:16px;
  color:#eee;
  background:#BDC8D0;
  text-decoration:none !important;
  border:1px solid #aaa;
}.boutonbas {
        position: fixed;
        bottom: 300px;
        right: 02px;
   
        }.boutonhaut {
        position: fixed;
        top: 480px;
        right: 02px;
 
      }
#navMP>a:hover{
  color:#fff;
  background:#CDD8E0;
  text-decoration:none !important;
}
#navMP-precedent{
  border-radius:8px 0 0 8px;
}
#navMP-suivant{
  float:right;
  border-radius:0 8px 8px 0;
}
 
#navMP-precedent::before{
  content:"Précédent"
}
#navMP-suivant::before{
  content:"Suivant"
}
.signature_div img{
            max-width: 500px !important;
            max-height: 200px !important;
            }
        dl.annonce {background-color:#C5FFCA;} /* Modifie la couleur de fond des annonces */
        dl.post-it {background-color:#CAC5FF;} /* Modifie la couleur de fond des post-it */
        .fa_avatar {
          width: 25px;
          height: 25px;
          position: relative;
          top: -3px;
          margin-right: 5px;
          border-radius: 3px;
          margin-bottom: -10px;
        }
                span.new-message { color: orange; }
#clignote {
.fa_avatar {
  width: 25px;
  height: 25px;
  position: relative;
  top: -3px;
  margin-right: 5px;
  border-radius: 3px;
  margin-bottom: -10px;
}
  .navbar ul{
background-color: #e5f1f9;
}
text-decoration:
 blink;
}
#navMP>a{
  display:inline-block;
  padding-left:10px;
  padding-right:10px;
  font-size:16px;
  line-height:16px;
  color:#eee;
  background:#BDC8D0;
  text-decoration:none !important;
  border:1px solid #aaa;
}
#navMP>a:hover{
  color:#fff;
  background:#CDD8E0;
  text-decoration:none !important;
}
#navMP-precedent{
  border-radius:8px 0 0 8px;
}
#navMP-suivant{
  float:right;
  border-radius:0 8px 8px 0;
}
 
#navMP-precedent::before{
  content:"Précédent"
}
#navMP-suivant::before{
  content:"Suivant"
}
                input[name=hideonline] {
                  display:none;
                }blink {
          visibility: expres​sion((function(){
          if (!window.IEBlink) {
          window.IEBlink = "visible";
          setInterval(function() {
          window.IEBlink = (window.IEBlink=="visible"?"hidden":"visible");
          var blinks = document.getElementsByTagName("blink");
          for (var i=0; i < blinks.length; i++) { blinks[i].style.visibility=window.IEBlink; }
          }, 700)
          }
          return "";
          })());
        }
/* sticky nav main */
#fa_sticky_nav {
  font-size:0; /* hide whitespace */
  text-align:center;
  background:#FAFAFA;
  border-bottom:1px solid #CCC !important;
  height:30px;
  position:fixed;
  right:0;
  z-index:999;
  overflow:hidden;
  transition:top 200ms linear, width 600ms ease-in-out;
}
 
#fa_sticky_nav li { display:inline } /* navlist adjustment */
 
 
/* sticky menu links */
#fa_sticky_nav a.mainmenu {
  color:#39C;
  font-size:12px;
  font-weight:bold;
  font-family:"Trebuchet MS", Arial, Verdana, Sans-serif;
  background:url('https://i.servimg.com/u/f18/18/45/41/65/nav10.png') repeat-x 0px 30px;
  display:inline-block;
  padding:0 10px;
  height:30px;
  line-height:30px;
  transition:200ms;
}
 
#fa_sticky_nav a.mainmenu:hover, #fa_sticky_nav a.mainmenu.fa_navactif {
  background-position:0 25px;
}
 
 
/* sticky nav toggler */
#fa_sticky_toggle {
  background:url('https://i.servimg.com/u/f21/18/21/41/30/omnibo10.png') no-repeat 0 0 #FAFAFA;
  border:1px solid #CCC;
  border-right:none;
  display:inline-block;
  height:29px;
  width:30px;
  position:fixed;
  right:0;
  z-index:999;
  transition:top 200ms linear;
}
 
#fa_sticky_toggle:hover { background-position:-30px 0 }
 
 
/* make hidden toolbar similar to toggler */
#fa_toolbar_hidden {
  border-radius:0 !important;
  border:1px solid #CCC;
  border-right:0;
  border-top:0;
}
 
 
/* post offset fix */
.post div[style*="-30px;"] {
  top:-60px !important;
}
#navMP>a{
  display:inline-block;
  padding-left:10px;
  padding-right:10px;
  font-size:16px;
  line-height:16px;
  color:#eee;
  background:#BDC8D0;
  text-decoration:none !important;
  border:1px solid #aaa;
}
#navMP>a:hover{
  color:#fff;
  background:#CDD8E0;
  text-decoration:none !important;
}
#navMP-precedent{
  border-radius:8px 0 0 8px;
}
#navMP-suivant{
  float:right;
  border-radius:0 8px 8px 0;
}
 
#navMP-precedent::before{
  content:"Précédent"
}
#navMP-suivant::before{
  content:"Suivant"
}
input[name=hideonline] {
  display: none;
  }.bouhautbas {
    bottom: 40px;
    left: 10px; /* remplacez left par right pour afficher les boutons à droite */
    position: fixed;
    z-index: 100;
}.haut
{
position:fixed;
margin-top:25%;
}.bas
{
position:fixed;
margin-top:28%;
} 
input[name=hideonline] { display: none; }



[Didou57]

Je viens de remplacer mon CSS par le tien et ça fonctionne. J'avais essayé juste avant de mettre le code en première ligne mais à la validation, le code repassait en fin de CSS... pas bien compris pourquoi... 

Merci pour le dépannage.

[*Splash*]

De rien