Pas moyen de styler ♦ dans Android

Bonjour,

Je pense ne pas être le seul à utiliser ♦ comme une puce.

J'affecte un style, par exemple :

<p>&diams; Chapitre 1</p>

p {color: grey}

Résultat attendu sur PC ou iPhone, le carreau est en gris.
Par contre Android va toujours l'afficher en rouge. Je comprends qu'il comprend que le signe Carreau est rouge sur un jeu de carte mais de là à m'interdire une autre couleur.
Je pense que ce comportement n'est pas normal, ♦ est une entité standard que je dois pouvoir styler moi-même, non ?

Voyez-vous un moyen d'imposer à Android le changement de couleur par les CSS, moi pas ?

Je n'ai pas envie d'employer une image à la place de ♦

Avez-vous d'autres pistes ?

Merci d'avance.
Modifié par boteha_2 (31 Oct 2018 - 19:41)

Bonjour,

Il me vient une idée : utiliser la pseudo-classe before pour créer ma puce.

Cela me permet d'utiliser en version petit écran une puce différente qui plaira à Android. Quelque chose comme • par exemple.

Les caractères spéciaux html laissent peu de choix, très peu sont utilisables comme puces, d'où mon choix de ♦ qui est assez sympa.

Bonjour,

J'ai mis en place la solution avec :before.

<p>Chapitre 1</p>

p:before {content: "\002666"; font-size: x-small; color: #B7C0D1}

@media screen and (max-width: 768px)
{
p:before {content: "\2022"; font-size: x-large}
}

Cela revient à utiliser ♦ en version PC et • en version mobile, • étant bien traité par Android.

Je ne coche pas résolu car la question était de savoir comment styler ♦ dans Android, cela semble impossible et rappelle IE5 dans le genre bug un peu énervant.

Bonsoir Boteha_2,

Sur mon android, je vois bien le ♦ en gris :\ (firefox)

Est ce que tu n'aurais pas une autre règle css qui prendrait le dessus sur la couleur grise.

As-tu essayé d'y ajouter la règle "!important" pour voir si ça pouvait aider ton android à utiliser le gris ?

Bonjour,

Dawwwid a écrit :

Sur mon android, je vois bien le ♦ en gris :\ (firefox)

J'ai essayé sur trois téléphones Android, un vieux et deux récents : toujours rouge.

Dawwwid a écrit :

Est ce que tu n'aurais pas une autre règle css qui prendrait le dessus sur la couleur grise.

Non.
La preuve, quand je remplace ♦ par • le rouge disparaît.

Dawwwid a écrit :

As-tu essayé d'y ajouter la règle "!important" pour voir si ça pouvait aider ton android à utiliser le gris ?

Oui, j'ai essayé, sans succès.