Forcer code CSS suivant les navigateurs Firefox, Chrome, Safari

Version imprimable

28/04/2022, 18h42
Gilles_75

3 pièce(s) jointe(s)

Forcer code CSS suivant les navigateurs Firefox, Chrome, Safari
Bonjour

Je rencontre des différences d'apparences suivant les navigateurs Firefox, Chrome, Safari.
Par exemple sur cette page
https://guideyourtrip.com/en/

En bas ( voir photo Sur-Firefox en pj )
Le libellé "Keep in Touch" correspond à la classe et_pb_contact_main_title
J'ai modifié l'apparence de ce texte dans le fichier style.css
Code:

1 2 3 4 5 6 7 .et_pb_contact_main_title { font-family: 'Amaranth' !important; font-size: 1.438em !important; color: #0c376c !important; }
Le changement de style ce fait bien sur Firefox mais pas sur Chrome ni Safari ( voir images Sur-Chrome et Sur-Safari pj )
Faut-il ajouter une spécificité au code css pour ces navigateurs ?

Merci pour votre aide.
29/04/2022, 09h39
Doksuri

Citation:

Je rencontre des différences d'apparences suivant les navigateurs Firefox, Chrome, Safari.

bienvenue dans le monde merveilleux du dev web :mouarf:

j'ai teste, chez moi j'ai bien le bon CSS applique

il est possible que tu aies du cache navigateur : pour tester tes devs, tu peux ajouter un timestamp a ton css
=> tonStyle.css?ts=12345

ps : 30 fonts, c'est de la folie !
29/04/2022, 11h17
Gilles_75

Merci

Je ne comprends pas quand tu dis
=> tonStyle.css?ts=12345
Ni 30 fonts, c'est de la folie !

Pourrais-tu m'expliquer ?
Merci
29/04/2022, 12h49
mathieu

pour les 30 polices, il voulait peut être dire qu'il trouve que c'est de trop. charger plein de polices qui ne sont pas utilisées va consommer plein de ressources inutilement côté serveur et côté client.
de plus vous dépendez d'un service externe donc au moindre souci, cela va augmenter le temps de chargement des pages.

pour l'url "tonStyle.css?ts=12345", le principe est de modifier l'url du fichier à chaque modification. c'est ce que fait déjà wordpress de base mais là j'ai l'impression que vous avez un autre souci puisque je ne vois pas de fichier "style.css" chargé sur la page.
quel est le chemin du fichier qui vous modifiez ?
est ce que vous avez une extension wordpress de cache ?
03/05/2022, 08h41
Declique69

Ces propriétés sont parfaitement standard et reconnues par tous les navigateurs.
Comme les confrères, je pense à un problème de cache.

Ou bien est-ce que c'est la police qui n'est pas reconnue, auquel cas les navigateurs la remplace par une autre police.

Remarque : l'usage de !important pose souvent des problèmes par la suite (mais ce n'est pas la cause ici, simplement j'évite absolument de m'en servir)
03/05/2022, 15h39
Gilles_75

L'usage de !important est parfois obligatoire quand on travaille avec wordpress et un Théme.
Il faut modifier des codes css dans le Théme enfant
05/05/2022, 10h20
Declique69

Citation:

Envoyé par Gilles_75

L'usage de !important est parfois obligatoire quand on travaille avec wordpress et un Théme.
Il faut modifier des codes css dans le Théme enfant

C'est vrai que si Wordpress utilise !important, on n'a plus trop le choix. C'est ce que je reproche à !Important : à partir du moment où il est utilisé quelque part on est obligé de le remettre de plus en plus souvent, et un peu de partout.
Mais si Wordpress ne l'utilise pas, on devrait pouvoir s'en sortir avec la règle des priorités.

Enfin bon, il faudrait voir le cas précis pour être sûr. Ce que je dis n'est qu'une remarque d'ordre général.