Cadre/fonds de couleur portés disparus (CSS)

[Golden Fish]

Détails techniques

Version du forum : phpBB2
Poste occupé : Membre
Navigateur(s) concerné(s) : Mozilla Firefox, 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 l'ignore, car je ne l'ai réalisé qu'en allant éditer le post et d'un coup, le problème m'est apparu. Et j'édite très rarement ce post.
Lien du forum : http://www.rictusempra.org/forum

Description du problème

Bonjour! J'aurais besoin d'aide avec un petit problème de cadres invisibles.

Mon problème n'est présent que sur ce forum uniquement. J'ai testé mes codes sur 5 autres forums et ils allaient très bien, alors je pense que le problème vient du forum rpg où je suis.

Le problème n'affecte que mes cadres/fonds de couleur.

Le html va très bien. Le reste du CSS va lui aussi très bien. Et je ne suis pas la seule à voir ce problème, du coup, ça ne vient pas de mon ordinateur. J'utilise chrome, mais j'ai été vérifier sur Mozilla : le problème reste. J'ai aussi modifié le nom des balises : rien non plus.

(Je ne suis que membre, mais passe les informations à l'équipe administrative.)

J'ignore ce qui pourrait avoir provoqué ce dit problème et après quelques recherches dans mon propre panneau d'administration en quête d'un truc qui aurait pu ne pas avoir été coché par le staff du forum, je viens vous consulter, parce que je n'ai personnellement pas réussi à trouver la source du problème (dah)

J'ai cherché sur le forum voir si quelqu'un avait une situation semblable à la mienne et n'ai pas trouvé (ou suis aveugle, ou autre).

Un gros (mais énorme) merci d'avance à ceux et celles qui voudront bien essayer de me venir en aide xD

[MlleAlys]

Bonjour,
serait-il possible de voir le code que vous utilisez s'il vous plait ? même si ça ne vient pas de là, ça permettra de comprendre un peu mieux ce qu'il se passe qu'avec une seule capture d'écran ^^"

[Golden Fish]

Oh, oui, très possible !

Voici deux captures d'écran du même problème sur une autre fiche :

Partout ailleurs/avant actualisation sur le forum :

Spoiler:

Ce qui arrive présentement/le problèeme :

Spoiler:

J'ai affiché ce code en libre service sur certains forums et personne ne m'a jamais signalé ce problème (et plusieurs l'ont utilisé).

Voici le semblant de CSS de la capture d'écran que je viens de donner :

Code:

<style type="text/css">.predefmod { background-color : #13100b; border: 5px solid #1c1b14; width: 510px; border-radius: 20px 20px 20px 20px; box-shadow: 0px 0px 25px #1c1b14; } .turlu { border: 2px solid #918b74; } .turlu:hover { border: 2px solid #a88039; } .turlu1 { border: 2px solid #918b74; width: 440px; } .turlu1:hover { border: 2px solid #a88039; } .predefcont { border: 6px solid #3a372e; } .opacityA img { filter:alpha(opacity=60); -moz-opacity:0.6; -webkit-opacity:0.6; opacity: 0.6; } .opacityA img:hover { filter:alpha(opacity=100); -moz-opacity:1;-webkit-opacity:1; opacity: 1; } f { color: #918b74; } f:hover { color: #a88039; } .infobulle{ position: relative;} .infobulle .infobulle-hidden { display: none; position: absolute; visibility: visible; z-index: 999; background: #3a372e; color: #a3a29a; padding: 3px; border: 0px solid grey; border: 3px solid #918b74; height: 100px; width: 300px; overflow:auto; text-align:justify; margin-top: -10px; margin-left: 10px; padding:8px; } .infobulle:hover .infobulle-hidden { display: block; z-index: 1; } .name { display: block; text-transform: uppercase; font-family: arial black; letter-spacing: 2px; color: #a88039; font-size: 18px; } .title { text-transform: uppercase; font-size: 26pt; font-family: arial black; letter-spacing: 10px; } .undertitle { text-transform: uppercase; font-size: 12pt; font-family: arial black; letter-spacing: 15px; color: #3a372e; margin-top: -10px; } .predefinfo { background: #3a372e; text-align:justify; width: 440px; color: #a3a29a; font-family: arial; } .undertext { margin-bottom: -10px; margin-top: 5px; line-height : 12px; text-transform: uppercase; font-family: arial; letter-spacing: -1px; word-spacing: 5px; color: #918b74; font-size: 14px; width: 440px; text-align:justify; } .text { border: 0px; width: 200px; height: 310px; padding: 10px; overflow: auto; text-align:justify; color: #6c6c5c; } .credit { color: #918b74; text-transform: uppercase; } .backimg { background-image : url(http://i.imgbox.com/gwzXzbav.png); width: 600px; border-radius: 200px 200px 200px 200px; box-shadow: 0px 0px 25px #6c6c5c; } .w { color: #8e5c54; font-weight: bold; }</style>

Et voici son semblant de html >__> :

Code:

<center><div class="backimg"><div class="predefmod"><br><TABLE><TR>
[center]<div class="title"><f>Nom de Famille</f></div>
<div class="undertitle">Prénom Prénom</div>[/center]
<div class="turlu1"><div class="predefinfo"><span class="w">Prénom P. Nom</span> [i]est né le[/i] <span class="w">DATE AU CHOIX</span> [i]au[/i] <span class="w">LIEU DE NAISSANCE</span> [i]et est maintenant âgé de[/i] <span class="w">ÂGE</span>. <span class="w">SANG</span>, [i]il a été réparti dans la maison de[/i] <span class="w">MAISON</span> [i]et est aujourd'hui en[/i] <span class="w">ANNÉE</span>.</div></div><div class="undertext">Pour obtenir un dégradé de vague comme je le fais sur mes fiches, allez [url=http://slimshady451.free.fr/texte/vague.php]ici[/url], Taille 1 = 10, Taille 2 = 20. Ne sélectionnez aucune police. "Monter au débût" doit être coché. Cliquez sur "crer le code" et sélectionnez le code donné dans "Code HTML". Remplacez ce paragraphe explicatif par ce dit code et le tour est joué!</div><TD>
<div class="text">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi nibh lacus, adipiscing eget placerat sit amet, varius a lacus. Sed id risus ac quam volutpat rutrum. Morbi nibh lacus, adipiscing eget placerat sit amet, varius a lacus. Sed id risus ac quam volutpat rutrum. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi nibh lacus, adipiscing eget placerat sit amet, varius a lacus. Sed id risus ac quam volutpat rutrum. Morbi nibh lacus, adipiscing eget placerat sit amet, varius a lacus. Sed id risus ac quam volutpat rutrum.</div>
</div></TD><TD><div class="turlu"><div class="predefcont"><div class="opacityA">[img]http://i.imgbox.com/bScUtnK4.png[/img]</div></div></div></TD></TR></TABLE>
<table><tr><td><span class="infobulle"><div class="opacityA"><img src="http://i.imgbox.com/xajx8dyf.png" class="turlu"; width="50";></div><span class="infobulle-hidden"><div class="name">Prénom P. Nom;</div> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi nibh lacus, adipiscing eget placerat sit amet, varius a lacus. Sed id risus ac quam volutpat rutrum. Morbi nibh lacus, adipiscing eget placerat sit amet, varius a lacus. Sed id risus ac quam volutpat rutrum. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi nibh lacus, adipiscing eget placerat sit amet, varius a lacus. Sed id risus ac quam volutpat rutrum. Morbi nibh lacus, adipiscing eget placerat sit amet, varius a lacus. Sed id risus ac quam volutpat rutrum.</span></span></td><td><span class="infobulle"><div class="opacityA"><img src="http://i.imgbox.com/xajx8dyf.png" class="turlu"; width="50";></div><span class="infobulle-hidden"><div class="name">Prénom P. Nom;</div> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi nibh lacus, adipiscing eget placerat sit amet, varius a lacus. Sed id risus ac quam volutpat rutrum. Morbi nibh lacus, adipiscing eget placerat sit amet, varius a lacus. Sed id risus ac quam volutpat rutrum. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi nibh lacus, adipiscing eget placerat sit amet, varius a lacus. Sed id risus ac quam volutpat rutrum. Morbi nibh lacus, adipiscing eget placerat sit amet, varius a lacus. Sed id risus ac quam volutpat rutrum.</span></span></td><td><span class="infobulle"><div class="opacityA"><img src="http://i.imgbox.com/xajx8dyf.png" class="turlu"; width="50";></div><span class="infobulle-hidden"><div class="name">Prénom P. Nom;</div> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi nibh lacus, adipiscing eget placerat sit amet, varius a lacus. Sed id risus ac quam volutpat rutrum. Morbi nibh lacus, adipiscing eget placerat sit amet, varius a lacus. Sed id risus ac quam volutpat rutrum. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi nibh lacus, adipiscing eget placerat sit amet, varius a lacus. Sed id risus ac quam volutpat rutrum. Morbi nibh lacus, adipiscing eget placerat sit amet, varius a lacus. Sed id risus ac quam volutpat rutrum.</span></span></td><td><span class="infobulle"><div class="opacityA"><img src="http://i.imgbox.com/xajx8dyf.png" class="turlu"; width="50";></div><span class="infobulle-hidden"><div class="name">Prénom P. Nom;</div> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi nibh lacus, adipiscing eget placerat sit amet, varius a lacus. Sed id risus ac quam volutpat rutrum. Morbi nibh lacus, adipiscing eget placerat sit amet, varius a lacus. Sed id risus ac quam volutpat rutrum. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi nibh lacus, adipiscing eget placerat sit amet, varius a lacus. Sed id risus ac quam volutpat rutrum. Morbi nibh lacus, adipiscing eget placerat sit amet, varius a lacus. Sed id risus ac quam volutpat rutrum.</span></span></td></tr></table>
<br><div class="credit">Anomalie © Célébrité © Credit de l'avatar</div></div></div></center>
[center][font=Verdana][size=9][color=#89554a]LIBRE[/color] | RÉSERVÉ | JOUÉ[/size][/font][/center]

Edit : Et voici une capture d'écran de ce que devrait avoir l'air ma première capture d'écran normalement :

Spoiler:

[MlleAlys]

AH !!!!
je crois savoir d'où vient le problème !! *illumination subite après plusieurs minutes de tests divers et de totale incompréhension* :

C'est la récente option Tags qui doit être activée sur ce forum, et du coup des liens s'intercalent dans la partie style, aux codes des couleurs à cause du symbole # !

Si c'est bien ça, utiliser le code rgb de la couleur plutôt que l'hexadécimal devrait régler le problème ! ^^

[Golden Fish]

Oh, mon dieu, si c'est ça, je t'aime ._.
*va aller modifier ça live*

*de retour*
Oh. Je suis heureuse. Le problème, c'est exactement ça. Merci, merciiiiii~