Champ de saisie texte dans une image

bonjour.

Je souhaiterais pouvoir cacher le cadre et le fond d'un champ de saisie pour n'afficher que le texte sur fond d'une image.

Lorsque j'inclue cette classe dans un input:

en css

.champ-newsletter { font: 10pt dingbats, sans, helvetica; color:black; 
text-align: center left;
background: url(champ-newsletter.png) no-repeat; 
width: 128px; height: 28px;float: left; 
z-index: 2; margin: 6px 0 5px 10px;}

en html

<INPUT type="text" class="champ-newsletter" size="14" maxlength="127" name="champ_newsletter" value="votre email">

Seul firefox (pas testé sous MSIE) m'affiche un résultat potable ( l'image est visible ), mais en mettant un cadre en relief (beurk). Konqueror affiche un champ avec fond blanc, et aucun ne tient compte des attributs de centrage du texte.

Je serais très heureux si quelqu'un disposait d'une solution en xhtml/css mais même en js ou php car je n'ai trouvé nulle part d'info sur une telle possibilité.

Merci.
Modifié par znorkx (23 Oct 2006 - 15:40)

Bonjour znorkx et bienvenue sur ce forum,

Pourrais-tu s'il te plait respecter la règle du forum qui demande que les codes cités soient mis en forme correctement :
13- Mise en forme générale des messages

Tu peux utiliser les balises [ code] et [ /code] (sans les espaces après le premier crochet) pour encadrer le code cité.

Merci de bien vouloir éditer ton premier message (en utilisant le bouton d'édition en haut à droite).

bonjour, désolé pour la mise en page, j'avais sélectionné le texte et cliqué sur code, pensant que ça plaçait correctement les balises après validation.

petit newbie deviendra grand avec le temps !

Tu peux commencer par utiliser un border: none pour les navigateurs qui t'autorisent à enlever la bordure des éléments input... en sachant que certains navigateurs ne l'autoriseront pas forcément, dont : Safari, Konqueror, etc.

Pour les éléments de formulaire, mieux vaut rester très simple.

Impeccable sous firefox, le rendu est très bien et le centrage du texte fonctionne correctement avec un padding.
Par contre, avec Konqueror, il n'y a effectivement rien de changé.

Le but n'est pas de faire compliqué, mais joli et les éléments de formulaire restent, en l'état actuel de mes connaissances et de mes désirs graphiques, les parents pauvres d'une pagination personnalisée.

znorkx a écrit :
et les éléments de formulaire restent, en l'état actuel de mes connaissances et de mes désirs graphiques, les parents pauvres d'une pagination personnalisée.

Et par conséquent, les parents riches d'une reconnaissance rapide par l'utilisateur des fonctionnalités proposées.
Le verre n'est pas forcément à moitié vide...