Plusieurs dizaines d'heures de boulot sur une charte graphique très complexe, découpage, compression parfaite des images, intégration XHTML et CSS impeccable. Tout fonctionne sous IE 6, 7 et sous Firefox (le rêve quoi).
Mais je suis pas fou, donc petit test chez ma nana qui forcement (c'est une nana) a un mac tout blanc tout beau et là ... !
Mac / Firefox : parfait ! Mac / Safari : tout est parfait sauf les champs de formulaires. J'y ai appliqué un style css (je fais disparaitre les bords pour y mettre une image légèrement arrondie en fond) et pourtant il n'y prête pas attention c'est à dire que les champs textes (input type=text) sont rectangulaires, fond blanc et contour. Quant au champ submit (input type=submit) qui avait un style similaire et une valeur nulle (le "ok" est sur l'image du bouton) et bien à la place apparait un pauvre bouton tout liquid mac vide !
Que faire ? Me résigner ? Maudir tous les mac/safari users ?
J'ai pas trop envie de baisser les bras donc si quelqu'un a déjà eu le même problème. Est-ce que Safari peut gérer les CSS sur des INPUTS ou non ?
Tant que j'y suis deuxième soucis sur un javascript, je ne vais pas reposter pour ça :
J'ai créer un script qui permet à un input type text de devenir input type password quand il est en focus. En gros :
- Quand on n'a pas cliqué dessus, il a une valeur genre "Mot de passe" en clair
- Quand on clique dessus (onFocus), les informations qu'on écrit apparaissent en étoiles (le type devient password).
- Quand on sort du champ (onBlur), si on l'a rempli, quand on retire le focus le champ reste de type password.
- Sinon, on l'a laissé vide, on réaffiche le message "Mot de passe" en clair (le champ repasse en type text).
J'ai fait un truc du style : monchamp.type = "password"; pour changer le type.
Sur Firefox le script fonctionne parfaitement tandis que sur Internet Explorer il ne fonctionne pas. Problème insolvable ou existe-il une solution ? Merci !
P.s : Apparement cette version de Safari ne gère pas les CSS sur les inputs, il faut attendre la prochaine version mais il existe certains hacks CSS (background:transparent par exemple) pour y palier.
safari gardera les champs systeme et pour les boutons de formulaire s'i n'est pas assez large et que tu as spécifié sa largeur dans ton code, les arrondis cachent ton texte genre "ok" met plus large et tu verra le texte.