IdentifiantMot de passe
Loading...
Mot de passe oublié ?Je m'inscris ! (gratuit)
Navigation

Inscrivez-vous gratuitement
pour pouvoir participer, suivre les réponses en temps réel, voter pour les messages, poser vos propres questions et recevoir la newsletter

Mise en page CSS Discussion :

Style different entre un input.text et un input.radio


Sujet :

CSS

  1. #1
    Membre régulier Avatar de titan_33
    Profil pro
    Inscrit en
    Janvier 2007
    Messages
    245
    Détails du profil
    Informations personnelles :
    Localisation : France, Gironde (Aquitaine)

    Informations forums :
    Inscription : Janvier 2007
    Messages : 245
    Points : 91
    Points
    91
    Par défaut Style different entre un input.text et un input.radio
    Bonjour

    je sais que le code suivant
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    input {
           border:1px outset #999;
           background-color:#efefef;
    }
    mettra tous mes controles de type input, soit input.text, input.radio, etc avec ce style.

    Toutefois, ce que je desirerais, c'est d'avoir un style spécifique pour mes radio-boutons.
    Existe-t-il une méthode pour cela ?
    Enfin quelque chose comme ce qui suit . . . et qui fonctionnerait.

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    input.radio {
           background-color:#000000;
    }
    Merci d'avance pour votre aide

    Titan

  2. #2
    Modérateur
    Avatar de Bisûnûrs
    Profil pro
    Développeur Web
    Inscrit en
    Janvier 2004
    Messages
    9 868
    Détails du profil
    Informations personnelles :
    Âge : 40
    Localisation : France, Rhône (Rhône Alpes)

    Informations professionnelles :
    Activité : Développeur Web

    Informations forums :
    Inscription : Janvier 2004
    Messages : 9 868
    Points : 16 258
    Points
    16 258
    Par défaut
    Tu as cette syntaxe mais non reconnue par IE6 :

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    input[type=radio]{
       /* code pour les boutons radio */
    }
    Sinon, tu es bon pour mettre une classe sur tous tes boutons radio.

  3. #3
    Inactif  
    Avatar de Kerod
    Profil pro
    Inscrit en
    Septembre 2004
    Messages
    11 672
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Septembre 2004
    Messages : 11 672
    Points : 20 778
    Points
    20 778
    Par défaut
    Ou s'ils appartiennent à des conteneurs différents tu peux obtenir ce résultat sans avoir à attribuer une classe à chaque radio.

    Exemple :
    Code html : Sélectionner tout - Visualiser dans une fenêtre à part
    <div class="input_radio">     <input type="radio" value="1" id="test" name="test" />     .....              .... </div> <div class="input_text">     <input type="text" value="1" id="text" name="text" />     .....          .... </div>

    Code css : Sélectionner tout - Visualiser dans une fenêtre à part
    .input_radio input{     .... } .input_text input {     .... }

Discussions similaires

  1. activation d'input text avec un bouton radio
    Par babe7 dans le forum Général JavaScript
    Réponses: 3
    Dernier message: 01/04/2010, 20h59
  2. Décalage de texte dans un input texte
    Par Gyl59 dans le forum Mise en page CSS
    Réponses: 2
    Dernier message: 03/12/2007, 17h43
  3. Ecrire dans un input text via un input button
    Par kevinf dans le forum Général JavaScript
    Réponses: 5
    Dernier message: 21/10/2007, 09h46
  4. [XHTML] input file sans champ input texte
    Par vny dans le forum Balisage (X)HTML et validation W3C
    Réponses: 7
    Dernier message: 15/08/2007, 12h56
  5. modifier la couleur d'un texte dans un input text
    Par mic79 dans le forum Mise en page CSS
    Réponses: 8
    Dernier message: 05/01/2005, 16h45

Partager

Partager
  • Envoyer la discussion sur Viadeo
  • Envoyer la discussion sur Twitter
  • Envoyer la discussion sur Google
  • Envoyer la discussion sur Facebook
  • Envoyer la discussion sur Digg
  • Envoyer la discussion sur Delicious
  • Envoyer la discussion sur MySpace
  • Envoyer la discussion sur Yahoo