Tutoriel Vidéo HTML-CSS : Personnaliser formulaire

Grafman Il y a 8 mois Répondre

Ne pas oublier de préciser les htmlentities, ça pourrait limiter les failles de sécurité...sinon attention aux pirates

Miister--Arthur Il y a 9 mois Répondre

Merci beaucoup, cela m'a vraiment aidé car peu de sites disent comment faire cela !

ok Il y a 10 mois Répondre

hio

asm Il y a 1 an Répondre

Pour ceux qui galère avec le fond blanc derrière l'image en .png (j'ai eu le même problème) il suffit d'appliquer un background-color:transparent; à #q input[type=text]

Merci pour cet excellent tuto !

deeploy Il y a 1 an Répondre

ENFIN !!! MAGNIFIQUE ! je peux enfin faire les zones de saisies que j'ai toujours rêvé !

Par contre j'ai juste eu une tuile que j'arrive pas du tout à résoudre c'est la transparence de mon champ. J'ai eu beau essayer (et pourtant je suis déjà depuis un moment sur toshop), mais pas moyen de rendre les coins transparents. Une idée peut-être ?

En tout cas super boulot merci.

Rony Il y a 1 an Répondre

Super tutorielet j'ai une petite question comment fais tu pour que les balises se mettent directement sur notepad

Gagi33 Il y a 1 an Répondre

Merci beaucoup pour ce tutoriel

arnaud Il y a 1 an Répondre

super :-)
mais néanmoins je voudrais savoir si il y avais moyen d'ajouter du javascript pour vider un textarea? vu qu'il n'y a pas de value sur un textarea!

sory Il y a 2 ans Répondre

Bonjour,il est super votre tutoriel merci

dani Il y a 2 ans Répondre

salut, sur photoshop, c'est bien un masque de calque que tu ajoute ? Car ton calque a eu comme une flèche et en théorie c'est plutot un carré pour les masque de calque ...

crack Il y a 2 ans Répondre

jolie tuto!!

ZWX Il y a 2 ans Répondre

YYYYYYYYYYYYYYYYYYYYYYYYYYYYAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOO

Trop bien ce tutoriel

lilj Il y a 2 ans Répondre

bonjour, super tuto merci à vous.
j'ai une question est-ce compatible avec IE ? car moi j'ai fait appel a un fichier htc et en plus, pour mon champ texte si j'entre beaucoup de caractère alors l'image de fond se décale vers la gauche toujours sous IE (pas de problème sous FF)
est-ce normal ? ou cela viendrait de mon code ?

raficraft Il y a 2 ans Répondre

Salut j'ai suivi le tutoriel à la lettre. Mais malheureusement je n'arrive pas à conserver la transparence au tour de mon champ texte. Un carré blanc persiste.
Quelle soit la taille ou le format d'image ( gif ou png). Je souhaite que ce soit l'image de mon body qui apparaisse à la place de ce liseré blanc.

Alors que l'image seule fonctionne.

robin850 Il y a 2 ans Répondre

Génial :D !

J'adore les tutoriels, ils donnent envie de coder, ils sont bien expliqués,...un grand bravo !

Cordialement robin.

Gugul Il y a 2 ans Répondre

Beau tuto !
Pour moi, tout va bien, excepté le fait que malgré le fait qu'elle soit en PNG avec fond transparent, ma barre de champs affiche les coins blancs et non des arrondies.

Pour voir : http://independenza.ovh.org/anthony/recherche/
Si quelqu'un à une solution, merci d'avance !

Et encore bravo pour le tuto =)

Drayark Il y a 2 ans Répondre

Il fait de même avec safari, je ne sais pas si il y a une solution à ton problème !

ghislain Il y a 2 ans Répondre

Bonjour,
Lors du tutoriel, j'ai remarquer que lorsque tu te positionne dans ton input, les bordures du champs deviennent orange (avec chrome)... Ce qui est un peu gainant à mon goût, sais-tu comment supprimer cet effet ?
Merci et bonne continuation.

Baptiste Il y a 2 ans Répondre

ok nickel merci!!! C'est vraiment un super site!! ^^
@+

Clément Il y a 2 ans Répondre

Merci pour ce tuto !

Pourrais-tu m'expliquer quelle manip tu fais pour fermer une balise automatiquement, par exemple au début de la vidéo avec la balise body ???

evy Il y a 2 ans Répondre

Encore merci tout tes tuto sont top, bien expliques et clair.
Et tu fais bien de preciser en fin que tes tutos a telecharger ne sont pas fait pour etre utilises sur le web mais pour apprendre. Je ne comprend pas les personnes qui copie au lieu d'apprendre en faisant son propre site.
Et pour Yop au sujet de ie6, de toute faon ie6 est loin derriere et tres..chiant. Rien que pour ie6, quand on fait un site il faut faire une section speciale pour lui afin que ton site s'integre aussi avec lui comme sur les autres navigateurs.. Il faut avoir du temps en faite juste pour lui..oubliez le c'est mieux

KaKuZa` Il y a 3 ans Répondre

Génial merci !

bork Il y a 3 ans Répondre

super tutoriel, sa m'a beaucoup aider et j'ai appris facilement de super chose pour améliorer le design d'un formulaire =)

mais j'ai un problème quand je veut mettre deux bouton (type=submit) dans ma barre (j'essaie de mettre un bouton pour connexion et s'inscrire) et bah quand j'essaie de changer le background du second bouton (s'inscrire) et bah sa marche pas. Même en y métant une class je n'est pas réussis donc si on pouvais m'aider svp !

merci et encore bravo

olivier Il y a 3 ans Répondre

merci beaucoup les tutos vidéos sont vraiment sympas et instructifs

Krabben Il y a 3 ans Répondre

Super tuto, mais serait-il possible d'avoir le psd de ton images stp.

Vince Il y a 3 ans Répondre

Bonjour, Merci pour ce tuto que je cherchais depuis quelques temps déjà.
J'ai un petit pb néanmoins avec IE 5/6, impossible de personnaliser le champ text et submit alors que cela fonctionne très bien sur les autres navigateurs...
J'ai testé plusieurs choses (modification du format, fonction "repeat", changer la position de l'image, ...) Bref un casse-tête... Aurais tu par hasard rencontré ce genre de problème et si tu aurais une solution (ou d'autres personnes?)
Merci en tout cas pour le blog!

cocolabombe0 Il y a 3 ans Répondre

Bonjour, si je me rappelle bien, alors pour le 3), tu donne la limite par rapport a la requete sql.
Tu peux changer la valeur de Taille/Valeurs*1 comme tu veux.
Regarde dans par exemple le tutoriel news qui en parle ou commentaire.
merci
a+

kaou Il y a 3 ans Répondre

bonjour. je cherche à faire quelques modfis sur mon textarea

1) supprimer la barre de scroll (déjà fait)
2) mettre un retour à la ligne et non un scroll horizontal
3) définir une longueur maximale de caractères sur mon textarea

merci beaucoup.
kaou

GoldenBoy Il y a 3 ans Répondre

Pour ceux qui recherche le tuto pour creer un champs de recherche il suffit de regarder dans la section php, penser a ouvrir vos yeux sa aide .

Valbuena72 Il y a 3 ans Répondre

Salut,
Bien joué, j'aime bien cette astuce du js
Sinon super site.

MATT Il y a 3 ans Répondre

PS: Quand je dis que cela ne change pas d'apparence je veux dire que cela reste le formulaire par defaut de IE ...

MATT Il y a 3 ans Répondre

Bonjour.
Tres bon tuto. Malgre tout, je n'arrive pas a comprendre pourquoi cela ne marche pas avec IE7. Ce qui ne marche pas c'est le champs et le bouton qui ne change pas d'apparance....

Je ne comprends pas le probleme. J'ai recupere les fichiers de tout exemple.

Enfin, je peux lire ton site sous IE7 sans prob...

COrdialement,

borow Il y a 3 ans Répondre

Bonsoir
Merci pour se très bon tuto seulement il y a encore une petite question que je n'arrive pas a résoudre
Sur le navigateur internet safari lorsque l'on sélectionne un champ texte d'un formulaire une décoration bleu comme un halo se place.
cela est très jolie sur les formulaire par défaut mais en le personnalisant sa rend vraiment un travaille bâclé...
je me suis aperçu que ton site ne prend pas en compte cette décoration sur safari pourrais tu m'expliquer pourquoi ?

Merci
Matthieu

Nelle.B Il y a 3 ans Répondre

super merci !!! clair et rapide!!!

Télio Il y a 3 ans Répondre

merci beaucoup je crois que c'est un de tes tutoriels qui m'ont le plus aidé

Arnaud Il y a 3 ans Répondre

Salut pourais tu faire un tuto en + ;-) car je ne sais pas comment crée une recherche via cette barre j'est placer une barre design de recherche mais comment faire pour qu'elle recherche des mots clef présent sur mon site et ainssi rassembler touts les élément trouver sur une meme page? merci pour ton aide ... au plaisir!!

Aisulu Il y a 3 ans Répondre

franchement, ce site il est trop bien

arnaud Il y a 3 ans Répondre

yes supers tuto mais maintenant j'aimerais savoir comment coder le formulaire de recherche... pour l'appliquer sur mon site en tout cas merci pour tout.

arno Il y a 3 ans Répondre

Finalement j'ai trouvé l'astuce pour que ce décalage ne soit pas apparant en découpant le champs de recherche en plusieurs images....c'est cool !!! et encore merci pour ton tuto !!!

dbg Il y a 3 ans Répondre

un grand merci, c'est cool!

arno Il y a 3 ans Répondre

Vraiment excellent ton tuto, merci !!!
Par contre quand je l'applique au site que je suis en train de concevoir voilà ce qu'il se passe :
lors de la saisie dans le champs l'image de fond utilisé pour la balise type=text se déplace sur la gauche à mesure que le champs se remplit (testé sous IE). Quelle est la soluce pour y remédier ?!

Shin Il y a 4 ans Répondre

Oh mon dieu c'est enorme comme tuto o_o"
Vraiment bien expliqué, vraiment utile, bien encodé et super bien codé.

Félicitation tu viens de gagner un émule xD

*marque-page activé *o* *

Dr Rodney Mckay Il y a 4 ans Répondre

Merci pour ce tutoriel. Il arrive à point nommé pour moi.

stefff Il y a 4 ans Répondre

Merci pour cette vidéo, je ne connaissais pas l'ajout de [type=submit] dans une css.

rolly Il y a 4 ans Répondre

vraiment excellent
merci!

Fenix Il y a 4 ans Répondre

c'est Cool ^^

Zawi Il y a 4 ans Répondre

Merci ! =D

1984 Il y a 4 ans Répondre

Merci ! ;-)