28173 sujets

CSS et mise en forme, CSS3

bonjour,
j'ai réccupéré le code suivant qui marche mais je ne voudrais pas de cadre autour des checkbox ; possible ?

input {
border:1px solid black;
background-color:grey;
font-family:"trebuchet ms",sans-serif;
color:black;
}
Modifié par gilles74 (21 May 2006 - 15:44)
Déjà, il faut savoir que le rendu des éléments de formulaire dépend beaucoup du système d'exploitation et/ou du navigateur. Le maîtrise que l'on peut avoir sur le rendu de ces éléments est parfois faible. C'est un inconvénient pour un graphiste qui veut que tout soit comme il le voudrait, mais c'est aussi une chance pour l'utilisateur, qui a ainsi des repères solides. Niveau ergonomie, c'est plutôt une bonne chose, donc.

Pour les checkbox, j'avoue ne pas trop savoir ce qu'il est possible de faire ou pas.

Pour supprimer le cadre, tu peux peut-être supprimer le border. Vu que ces éléments auront par défaut une bordure, il faut dire qu'on ne souhaite pas en avoir :
border: none;

Mais je ne suis pas sûr de l'efficacité de la démarche.

Reste maintenant la question du sélecteur. input désigne l'ensemble des champs de saisie. Il faut donc viser plus spécifiquement les input de type checkbox. On peut utiliser le sélecteur CSS suivant :
input[type=checkbox] { border: none; }

Ce qui fonctionnera avec la plupart des navigateurs… sauf Internet Explorer, en retard sur ce genre de choses. On voudra alors peut-être passer par une classe spécifique.

HTML :
<input type="checkbox" class="checkbox" value="machin" />

CSS :
input.checkbox { border: none; }


Mais là encore, pas sûr du rendu final suivant les navigateurs/Systèmes d'exploitation.
merci pour la réponse complète et précise.

j'ai pris en compte la solution 1 de la façon suivante :

<input type="checkbox" name="selection'.$indice.'" value="'.$file.'" style="border: none;" />

et ça marche sous IE

Encore merci.