28216 sujets

CSS et mise en forme, CSS3

Solution CSS pour afficher une étoile rouge / champs obligatoires

Bonjour,

Dans un formulaire, je dois indiquer les champs obligatoires en saisie par la classique "*" en rouge. Je souhaiterais pouvoir mettre ça en css.
Existe-t-il une solution qui permette de le faire ?

Vous remerciant par avance pour vos pistes de solutions.

AP
Administrateur
Hello, tu peux le faire très simplement ainsi :


<p>Nom <span class="obligatoire">*</span> :</p>

.obligatoire {color: red;}


Ou alors dynamiquement à l'aide d'une génération automatique :

<p class="obligatoire">Nom :</p>

p.obligatoire:after {
content: "*";
color: red;
}


Cette seconde solution, outre le fait qu'elle ne fonctionne pas sur IE6-, est à déconseiller car l'information sera perdue lorsque les CSS ne sont pas actifs.
Modifié par Raphael (10 Aug 2006 - 11:19)
Salut !

a écrit :
Cela marche avec Firefox mais pas avec IE6.

La première solution de Raphael fonctionne avec IE, c'est sûr. Et comme il l'a dit, elle est plus appropriée que la seconde, avec la génération automatique.
Sopo a écrit :
Salut !

Cela marche avec Firefox mais pas avec IE6.

La première solution de Raphael fonctionne avec IE, c'est sûr. Et comme il l'a dit, elle est plus appropriée que la seconde, avec la génération automatique.

Oui évidemment ! Mettre une étoile rouge directement dans la page aussi Smiley cligne
Mais bon, s'il existe une solution équivalente à la 2è, tout en css, je préférerais.

Cdlt,

AP
Bonjour,

apprentipeintre a écrit :

Mais bon, s'il existe une solution équivalente à la 2è, tout en css, je préférerais.


Comme Raphaël l'a suggéré, les solutions ''tout en CSS'' sont au contraire à éviter: l'information dépendant du support des feuilles de styles sera perdue pour une partie des utilisateurs. Ici, ce sera en particulier le cas pour les utilisateurs de lecteurs d'écran... qui ont justement le plus besoin de formulaires aussi explicites et clairs que possible Smiley cligne
Laurent Denis a écrit :
Bonjour,



Comme Raphaël l'a suggéré, les solutions ''tout en CSS'' sont au contraire à éviter: l'information dépendant du support des feuilles de styles sera perdue pour une partie des utilisateurs. Ici, ce sera en particulier le cas pour les utilisateurs de lecteurs d'écran... qui ont justement le plus besoin de formulaires aussi explicites et clairs que possible Smiley cligne


Dont acte.
Merci pour ces explications. Smiley smile
Sujet clos
Aller à