Bonjour j'ai un site avec un template que j'ai acheté.

Il y a une page avec un bouton, où TOUS les navigateurs l'affichent bien sauf CHROME et uniquement sur MAC!!! Vous avez les screenshot en pièce jointe, celle en couleur vient de Mozilla sur Mac et l'autre de Chrome sur Mac. D'où pensez-vous que ca vient (j'ai déjà vidé le cache et rien ne s'affiche sur la console javascript dans outils de développement...)

Merci d'avance!

Salut,

essaye d'ajouter ça sur ton bouton (CSS) :

appearance: none;

Ça retire les styles par défaut que mettent les navigateurs sur certains éléments comme les button et les input.

-
Edité par Syltaen 21 avril 2018 à 9:49:54

Bonjour,

on pourrait avoir le code surtout ? Personnellement je n'ai pas répondu plus tôt parce que je ne comprenais pas du tout le screenshot…

A mon avis il manque une image.

Bon, après avoir vu ton site :

• je ne reproduis pas le problème, Google Chrome (sous Ubuntu 17.10) met bien tes boutons en couleur
• un <a> ne doit pas avoir de type "button", et je pense que c'est là ton souci visuel

Wow c'était exactement ca (l'histoire du type "button"). Tout marche maintenant, merci! Je vais le corriger de suite sur mon site

Tu sais me dire pourquoi ca a bloqué sur TOUS les navigateurs, tous les OS cofondus à part CHROME sous MAC?

Et dernière chose, à quoi sert le "type='button'"? parce que à la base, ca vient du template. Ca m'étonne que ce designer aguerri mettent des choses erronnées...

Un grand grand merci à tous en cas!!

Le type "button" est à mettre sur les <button> uniquement, pour les rendre inactifs s'ils sont dans un formulaire (par défaut ils soumettent les formulaires).

Peut-être ton designer voulait-il mettre 'role="button"' ? Ce qui serait d'ailleurs une bonne idée puisque ton lien ne va nulle part.

Je comprends un peu mieux. Mais alors ce "role="button" serait uniquement pour le SEO ou une bonne pratique? Parce que sinon je vois pas son intérêt?

Rien à voir avec le SEO, c'est de la sémantique ici Cet attribut sert à indiquer quel est le rôle de l'élément. Comme normalement un lien est censé mener quelque part, et que là on change son fonctionnement, on ajoute l'attribut role pour dire au navigateur que ça doit agir comme un bouton. On pourrait aussi remplacer par un <button> (avec un type button pour faire propre), mais on reviendrait sur le problème initial, et plus de CSS serait probablement nécessaire.