Résolu Pb tranparence petit rectangle

Bonjour les amis, j'aimerais soumettre aux initiés un problème de compatibilité avec un code inscrit dans le HTML de l'interface de création d'article.

Voici le code :

<style><!--
.px{position:absolute; width:4vw; height:2.4vw; border:none background:transparent;}

Voici le résultat dans l'interface.  .px représente le petit rectangle blanc qui devrait être transparent.


Et voici le résultat en enregistrant l'article. Toujours pas de transparence. En cliquant sur le petit rectangle qui est devenu bleu clair je change d'image mais je voudrais voir le "CLIC" du dessous.


Quelqu'un pourrait-il m'aider ? Merci d'avance.

bonsoir,

vers la fin du thème il y a une petite modification à faire qui va probablement résoudre le problème. (ça fonctionne en simulation partielle sur la page du blog)

Voir cette copie d'écran:

Merci Stormalo, dans l'interface ça marche bien mais lorsque j'enregistre l'article le rectangle bleu clair revient sans être transparent. C'est ça qui m'embête.

Penser que dans l'affichage réel ça doit être comme dans celui de l'interface de l'éditeur est une erreur. C'est cela qui est embêtant.

La saisie dans l'interface n'est  soumise à la totalité du css du blog que lorsqu'elle est injectée dans la page web ; sinon elle est hors contexte global, et donc son apparence peut être différente.

Avec Firefiox et Google (ou d'autres) un clic droit permet d'examiner un élément et de connaitre les règles appliquées et leurs sources. Ce qui est à l'origine de ma proposition.

Ça ne coute rien d'essayer, après tu indiqueras si ça a fonctionné ou non.

Bonjour vadou, coucou stormalo,

@stormalo : j'ai fait un essai avec ce que tu préconisais mais ça ne fonctionnait pas.

@vadou,
J'ai réussi à appliquer ce que tu cherchais à faire en ajoutant dans le html ce qui est en rouge afin que ce ne soit pas le paramétrage du blog qui soit pris en compte.

<div style="width: 56vw; height: 37vw; margin: 2vh auto; border: 0.4vh ridge white; background: url('http://ekladata.com/NtqCfZMALun40G--Lk-SiD4nak0.jpg'); background-size: 56vw 37vw;"><input id="px1" class="px" style="background: transparent;" type="text" /><input id="px2" class="px" style="background: transparent;" type="text" /><input id="px3" class="px" style="background: transparent;" type="text" /><input id="px4" class="px" style="background: transparent;" type="text" /><input id="px5" class="px" style="background: transparent;" type="text" /><input id="px6" class="px" style="background: transparent;" type="text" /><input id="px7" class="px" style="background: transparent;" type="text" />
<p id="px0">Clic</p>
<p id="yx1" class="yx">&nbsp;</p>
<p id="yx2" class="yx">&nbsp;</p>
<p id="yx3" class="yx">&nbsp;</p>
<p id="yx4" class="yx">&nbsp;</p>
<p id="yx5" class="yx">&nbsp;</p>
<p id="yx6" class="yx">&nbsp;</p>
</div>

et en supprimant dans cette ligne de code du css ce qui est en bleu et qui ne sert à rien :

<style><!--
.px{position:absolute; width:4vw; height:2.4vw; border:none; background:transparent;}

Bonne fin de week-end à vous 2.

Bonjour Colette95,    comment ça, on conteste !  

Lors de mon comm du 05/10 je ne pouvais pas accéder à tout le css de la page affichée, mais uniquement sur la partie concernant l'élément concerné. A l'instant j'ai pu accéder normalement et tester en agissant sur le thème global.
Résultat OK (voir copies d'écran ci-dessous)

    



Par ailleurs, j'ai rencontré des situations similaires ou pour modifier la valeur d'une propriété, cela devait être fait en utilisant la même syntaxe que la précédente
Ainsi un background-color: devait être modifié que par un autre background-color: (et pas avec une écriture backgroud:). Cependant je n'affirme pas que c'est une règle.

Peut être que si vadou remplace son background: transparent; par un background-color: transparent ; ça fonctionnerait aussi, et sans retoucher le thème.

A suivre ...

Oui, oui, je suis la contestataire  

J'avais fait des essais et en essayant ce que tu avais indiqué, cela modifiait le paramétrage du blog. Il n'y a qu'en incluant le code directement dans le html que l'on obtient le résultat souhaité. 

Bon, je pense que vadou nous tiendra au courant et en attendant la suite, je te souhaite une excellente soirée. 

@Colette95,

OK, je n'ai pas fait attention a cet aspect "sélecteur existant". 

Cependant, ma dernière phrase du post précédent est peut être pertinente :

"remplacer son background: transparent; par un background-color: transparent ;"

@stormalo 

Me serais-je mal exprimée ?...  alors je confirme que même en suivant ce que tu indiques dans ta dernière phrase, ça ne fonctionne pas. 

Merci Colette et Stormalo, Je vais essayer la version de Colette.

Pour Stormalo, voilà ce que j'ai introduit mais à chaque fois sans résultat :

Background-color: transparent;]

Background-color:rgba(255,255,255,0);]

A plus, cordialement