Bug d'affichage des blocs centraux !

[JuliaLany]

Détails techniques

Version du forum : Inconnue
Poste occupé : Fondateur
Navigateur(s) concerné(s) : Google Chrome
Capture d'écran du problème :

Voir l'image:

Personnes concernées par le problème : Tous les utilisateurs
Problème apparu depuis : Je ne sais vraiment pas, je crois que c'est en rapport avec les images...
Lien du forum : http://nxt-efed.forumactif.org/forum

Description du problème

Bonjour,

Me voilà pour un second problème à résoudre haha !

Donc comme vous pouvez le voir sur le screen, il y a un dépassement de bloc dû à (peut-être) si on met plusieurs images dans le même texte. Cela reste une hypothèse. Ca ne me le fait pas que sur ce sujet mais sur un sujet (je sais pas si les Admins d'ici le verront vu que c'est une partie cachée) : http://nxt-efed.forumactif.org/t359-break-the-rules-i-22-02-16-time-of-man et voici le sujet du screen que je vous ai montré : http://nxt-efed.forumactif.org/t342-sasha-banks-vs-liv-morgan-vs-charlotte

Je vous autorise à modifier quoi que ce soit tant que le problème est résolu.

Merci d'avance ♥

(J'avais oublié de up le sujet plutôt, mon sujet a été fermé ici : https://forum.forumactif.com/t384217-bug-d-affichage-des-blocs-centraux#3233296 )

[JuliaLany]

Up :3 ♥

[MlleAlys]

Bonjour,
Impossible d'accéder au sujet en question.
Le point à définir est le comportement que vous souhaitez en cas d'élément(s) trop large dans le contenu du forum... (qui dépasse où, débordement visible ou non, ou bien barre de défilement, ou bien élargissement de tout le monde, etc)
Si vous voulez éviter facilement le décalage visible sur la droite entre les blocs, vous pouvez retrouver le code css suivant dans votre feuille de style :

Code:

#page-body {
    -htm-border-radius: 10px;
    -htm-box-shadow: 0 0 5px #000;
    -moz-border-radius: 10px;
    -moz-box-shadow: 0 0 5px #000;
    -o-border-radius: 10px;
    -o-box-shadow: 0 0 5px #000;
    -webkit-border-radius: 10px;
    -webkit-box-shadow: 0 0 5px #000;
    background: url() top left repeat #e6e6e6;
    border-radius: 10px;
    box-shadow: 0 0 5px #000;
    margin: 10px auto;
    padding: 5px;
    width: 980px;
}

et supprimer la ligne width: 980px; ce qui donne :

Code:

#page-body {
    -htm-border-radius: 10px;
    -htm-box-shadow: 0 0 5px #000;
    -moz-border-radius: 10px;
    -moz-box-shadow: 0 0 5px #000;
    -o-border-radius: 10px;
    -o-box-shadow: 0 0 5px #000;
    -webkit-border-radius: 10px;
    -webkit-box-shadow: 0 0 5px #000;
    background: url() top left repeat #e6e6e6;
    border-radius: 10px;
    box-shadow: 0 0 5px #000;
    margin: 10px auto;
    padding: 5px;
}

Le contenant s'élargira en même temps que le contenu et donc ce décalage ne sera plus visible.

[JuliaLany]

Bonjour,

merci pour cette astuce mais cela élargit beaucoup trop mon forum malheureusement.

Cordialement.

[MlleAlys]

Est-il possible d'accéder à un sujet déformé ?

Et que souhaitez-vous dans ce cas si le message posté est trop large ? une barre de défilement ? que ce soit le contenu du message qui dépasse et pas son cadre ? Que ce qui dépasse soit invisible ?

[JuliaLany]

Alors oui mais j'évite d'ouvrir aux invités mais voilà un sujet ouvert : http://nxt-efed.forumactif.org/t388-break-the-rules-ii-29-02-16-the-last-light sur le côté ça dépasse :/

Non j'aimerais juste que ce soit mis normalement quoi. Car si je met deux images dans le même poste, de la même taille, ça flanche carrément et c'est pas joli ! Que ce soit le contenu du message qui dépasse et pas son cadre, oui.

[MlleAlys]

Localisez le code suivant dans votre feuille de style :

Code:

.message_content {
    background: #dfded0;
    border: 1px solid #bebebe;
    color: #4c4c4c;
    font-size: 12px;
    margin: 10px;
    padding: 5px;
    text-align: justify;
}

Complétez-le ainsi :

Code:

.message_content {
    background: #dfded0;
    border: 1px solid #bebebe;
    color: #4c4c4c;
    font-size: 12px;
    margin: 10px;
    padding: 5px;
    text-align: justify;
    max-width: 700px;
    overflow: visible;
}

Et enregistrez.

(au passage, toutes les images dans les messages sont invisibles aux invités )

[JuliaLany]

Bonjour,

merci beaucoup, cela semble marcher ! Puis-je avoir des explications sur ce codage, qu'est-ce que vous avez modifié en particulier ? ^^

[MlleAlys]

J'ai appliqué une largeur maximale de 700px au bloc qui contient le message, et précisé au cas où que ce qui pourrait dépasser doit rester visible. ^^

[JuliaLany]

D'accord merci beaucoup en tout cas ! Très très utile, je vous recommande !