Mauvais affichage de la prévisualisation d'un message.

[Aly SV]

Détails techniques

Version du forum : phpBB2
Poste occupé : Fondateur
Navigateur(s) concerné(s) : Mozilla Firefox, Google Chrome
Personnes concernées par le problème : Tous les utilisateurs
Problème apparu depuis : L'ajout d'un code dans le CSS pour faire apparaître un cadre dans les message.
Lien du forum : http://ss-newdivine.positiforum.com/

Description du problème

Bonjour à tous,

Je viens vers vous, car je viens de remarquer un problème assez gênant. En effet, les membres et moi même, rencontrons quelques soucis lorsqu'il s'agit de prévisualiser nos message.

D'adord, la prévisualisation ne prend que la moitié gauche de la page, au lieu de prendre toute la page.
Ensuite, si l'on veut prévisualiser un code, soit le rendu ne va vraiment pas et le code semble explosé, soit, le rendu est bon, mais il manque le background.
Et pour finir, le cadre que j'ai voulu installer autour de mes messages n'apparaît pas au niveau du message, mais au niveau de la signature.

Exemple de prévisualisation d'un message simple :


Rendu du message : http://new-divine.positiforum.com/t61-libra-no-erza

Exemple d'un prévisualisation avec un code HTML :


Rendu sur le post : http://new-divine.positiforum.com/t67-1-demande-de-rang

Le problème apparaît avec des code HTML +CSS et des codes HTML purs. Et je ne rencontre pas ce problème sur d'autre forum, j'en déduis que ça ne viens pas des codes.

Voici le CSS de mes cadres autour des message :

Code:

/*CADRE AUTOUR DES MESSAGES*/
.postbody > div:not(.clear){
  margin: 12px 0;
  padding: 12px;
  overflow: hidden;
  background-color:rgba(166, 134, 93, 0.5);
  border: 1px solid #A6865D;
  border-top-right-radius:2em;
  border-bottom-left-radius :2em;
  width:540px;
}
/*FIN CADRE AUTOUR DES MESSAGES*/

J'ai plusieurs template de modifié, si il vous faut les voir, suffit de demander, je ne sais pas laquelle pourrait vous être utile !

Merci à ceux qui pourront me donner un coup de main !

Bonne journée ^^

[Aly SV]

Un petit up ^^

[Aly SV]

Up s'il vous plait, c'est un soucis vraiment gênant !

[Alzufen]

Bonsoir,

Me permets-tu de créer un compte test (que tu pourras supprimer ensuite) sur ton forum pour essayer de régler le soucis via l'outil de développement de Chrome ? ^^

[Aly SV]

Bonsoir,

J'ai pas tout compris, mais oui, si les accés d'un simple membre te suffissent ^^
Le problème est également présent sur Firefox.

[Alzufen]

Oui ça me suffit, on peut accéder à pas mal de choses avec le code source d'une page, bien entendu ça ne modifie l'affichage que chez moi, mais ça permet généralement de repérer une erreur et d'indiquer comment la corriger ensuite ^^

Je préfère procéder comme ça dans 90% des cas

[Aly SV]

Si tu le dis XD je peux que te faire confiance XD

[Alzufen]

En fait j'aurais pu voir ça bien avant juste en regardant ton CSS... Pour le fais que le cadre apparaît juste autour de la signature et non autour du message c'est parce que tu mets :

Code:

.postbody > div:not(.clear)

De ce fais, les propriétés qui suivant vont être appliqué aux div n'ayant pas la class "clear" et contenu dans "postbody" la seule div qui répond à tout ça est celle des signatures. Si tu veux que le message soit vu comme il faut dans la prévi il faut que tu ajoutes à "postbody" tout seul mais si jamais ça pose un soucis, tu peux ajouter un div autour du message dans "posting_preview" (un template dans Poster & Message privé), mais ça ajoutera aussi autour de la div, du coup si ça ne doit pas prendre en compte la div, il va falloir tricher et ajouter une div en jQuery autour du texte mais pas de la signature.

Ensuite, c'est quoi le soucis avec un code HTML ? C'est la largeur du message ? Si oui c'est à cause du "width: 540px;" qui force le bloc à faire 540px de largeur

[Aly SV]

Ok, alors, comme j'ai absolument rien compris à ton explication, on va faire plus simple XD

Puisqu'en virant le CSS présenté au dessus, tout s'arrange, me faudrait juste un code CSS qui me permettrais de faire apparaître un cadre autour des messages et uniquement autour des messages.

Edit : J'ai réussit à faire ce que je voulais, un problème persiste cependant.
Dans la prévisualisation, la signature apparaît incluse dans le cadre sencé apparaître seulement autour du message.

[Alzufen]

Va dans Panneau d'administration > Affichages > Templates > Poster & Message privés > posting_preview et repère :

Code:

      <table width="100%" border="0" cellspacing="0" cellpadding="0">
         <tr>
            <td><div class="postbody"></div></td>
         </tr>
      </table>

Puis remplace par :

Code:

      <table width="100%" border="0" cellspacing="0" cellpadding="0">
         <tr>
            <td><div class="previsu"><div class="postbody"><div class="previ_post">{MESSAGE}</div></div></div></td>
         </tr>
      </table>

Pour va dans "Modules > (Tout en bas) Gestion des pages Javascript (Vérifie que "Oui" est coché) > Créer une nouvelle page, sur toutes les pages, puis entre le contenu suivant :

Code:

$(function(){
    var html = $('.previ_post .signature_div').html();
    $('.previsu').append('<div class="postbody"><div class="signature_div">'+html+'</div></div>');
    $('.previ_post .signature_div').remove();
});

Ensuite, le CSS pour le message dans la prévisu devra être appliqué à la class ".previ_post", celle pour la signature reste ".signature_div", il te suffira donc de mettre ça dans ton CSS :

Code:

.previ_post{
  margin: 12px 0;
  padding: 12px;
  overflow: hidden;
  background-color:rgba(166, 134, 93, 0.5);
  border: 1px solid #A6865D;
  border-top-right-radius:2em;
  border-bottom-left-radius :2em;
  width:540px;
}

[Aly SV]

Ca n'a rien changé, sinon que ça a doublé le cadre ><

[Alzufen]

Je peux voir ? Tu peux l'installer sur ton forum que j'aille voir ? ^^

[Aly SV]

Je pense que le plus simple serait encore que je trouve un BON code pour faire les cadres autour de mes messages.

Parce que celui d'avant ne fonctionnait pas correctement, celui-ci non plus.
Sans compter, que j'ai à présent un sérieux soucis lorsque je fais une citation !

[Alzufen]

Dans ton CSS tu as :

Code:

.postbody {
background-color: rgba(166,134,93,0.5);
border: 1px solid #A6865D;
border-bottom-left-radius: 2em;
border-top-right-radius: 2em;
min-height: 70px;
padding: 12px;
}

Remplace par :

Code:

.post .postbody {
background-color: rgba(166,134,93,0.5);
border: 1px solid #A6865D;
border-bottom-left-radius: 2em;
border-top-right-radius: 2em;
min-height: 70px;
padding: 12px;
}

Et essaye de réinstaller mon code du début à la fin

[Aly SV]

J'ai réussis à régler le problème en virant carrément ce cadre de la prévisualisation.

Merci de ton aide ^^

Est-ce que je peux supprimer dés maintenant le compte que tu as créé ?

[Alzufen]

Oui supprime, j'en ai plus besoin du tout

[Chacha]

J'ai réussis à régler le problème en virant carrément ce cadre de la prévisualisation.

Merci de ton aide ^^

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