Ah ! ces éléments remplacés que sont les éléments de formulaire...
On croit avoir trouvé la panacée pour changer leurs styles CSS puis, sur une MAJ d'un navigateur, on s’aperçoit que ce dernier à changé les règles (ajout ou suppression d'une petite icône dans un input, etc). En plus, pour un même navigateur (ex : Chrome), l'input n'a pas la même apparence sur mobile que sur desktop...
J'ai bien tenté de jouer sur les ::-webkit-datetime-edit-fields-wrapper et autres ::-webkit-calendar-picker-indicator, mais pour Firefox, nop : pas de sélecteurs en vue :
https://codepen.io/olivier-c/pen/jOwPrWo
Souvent, le patch ultime est de positionner un élément ou un pseudo-élément** pour cacher l'éventuelle icône. En 2024, nous en sommes toujours là ? :
https://scriptura.github.io/app/UA0/
Et vous ? Comment faites-vous ?
____
** Mais pour ce dernier cas, pas sur l'input lui-même qui, en tant qu'élément remplacé, n'est pas censé supporter les pseudo-éléments.
Modifié par Olivier C (02 Nov 2024 - 11:57)
On croit avoir trouvé la panacée pour changer leurs styles CSS puis, sur une MAJ d'un navigateur, on s’aperçoit que ce dernier à changé les règles (ajout ou suppression d'une petite icône dans un input, etc). En plus, pour un même navigateur (ex : Chrome), l'input n'a pas la même apparence sur mobile que sur desktop...
J'ai bien tenté de jouer sur les ::-webkit-datetime-edit-fields-wrapper et autres ::-webkit-calendar-picker-indicator, mais pour Firefox, nop : pas de sélecteurs en vue :
https://codepen.io/olivier-c/pen/jOwPrWo
Souvent, le patch ultime est de positionner un élément ou un pseudo-élément** pour cacher l'éventuelle icône. En 2024, nous en sommes toujours là ? :
https://scriptura.github.io/app/UA0/
Et vous ? Comment faites-vous ?
____
** Mais pour ce dernier cas, pas sur l'input lui-même qui, en tant qu'élément remplacé, n'est pas censé supporter les pseudo-éléments.
Modifié par Olivier C (02 Nov 2024 - 11:57)