Version complète: sur le forum Webmaster Hub : Champs de formulaire personnalisés
Webmaster Hub > Création et exploitation de Sites Internet > Les langages du Net > (X)HTML et CSS
sparh
vendredi 11 avril 2008 à 19:38
Salut,
j'utilise les css pour personnaliser mes champs de formulaire.
Voici mon code

CODE
<input class="orange" type="text" name="email" id="email"
style="border:0;  background-image:url(images/champ-formulaire.png); background-position:top left; background-repeat:no-repeat; width:250px; height:30px; padding-left:7px; padding-top:6px; padding-right:10px; background-color: transparent; text-align:center;"  value="<?php echo $_POST['email']; ?>"/>


Tout va bien sauf avec Firefox je n'ai plus de "pipe" (le petit truc qui clignotte et qui indique ouù est le pointeur de la souris)

Une idée ?
iNCiTE Web
samedi 12 avril 2008 à 11:02
CITATION(sparh @ vendredi 11 avril 2008 à 20:38) *
Salut,
j'utilise les css pour personnaliser mes champs de formulaire.
Voici mon code

CODE
<input class="orange" type="text" name="email" id="email"
style="border:0;  background-image:url(images/champ-formulaire.png); background-position:top left; background-repeat:no-repeat; width:250px; height:30px; padding-left:7px; padding-top:6px; padding-right:10px; background-color: transparent; text-align:center;"  value="<?php echo $_POST['email']; ?>"/>


Tout va bien sauf avec Firefox je n'ai plus de "pipe" (le petit truc qui clignotte et qui indique ouù est le pointeur de la souris)

Une idée ?


J'ai déjà eu le cas mais je me suis pas penché dessus... essaie de retirer toutes les propriétés une par une pour voir celle ou la combinaison de celles qui génère ça... mais ça peut être aussi lié au code de la page, car si je teste juste cette partie j'ai bien mon curseur sous FF2 quand je clique dans la zone...

Par ailleurs tu peux regrouper tes éléments de background :
CODE
background: url(images/champ-formulaire.png) top left no-repeat transparent

Ceci est une version "bas débit" de notre forum. Pour voir la version complète avec plus d'information, la mise en page et les images, veuillez cliquer ici.