Bouton radio dans un formulaire

tatiana006 Messages postés 6 Statut Membre -
Pitet Messages postés 2845 Statut Membre - 24 mars 2016 à 17:27

Bonjour

Je souhaiterai inclure un bouton radio afin d'avoir une possibilité de choisir dans mon formulaire

Cependant je n'arrive pas à aligner les noms de choix avec mes boutons radios, les noms se mettent les uns à la suite des autres et ne sont pas du tout alignés avec les boutons .


<fieldset id="formulaire">
          <form id="connexion_form" name="connexion_form" method="post" action="">
            <p> Nom </p>
            <input type="text" id="nom_inter_crea" name="nom_inter_crea" value="">
            <p> Adresse </p> 
            <input type="text" id="adresse_inter_crea" name="adresse_inter_crea" value="">
            <p> Code postal </p>
            <input type="number" id="zip_inter_crea" name="zip_inter_crea" value="">
            <p> Ville </p>
            <input type="text" id="ville_inter_crea" name="ville_inter_crea" value="">
            <p> Adresse mail </p>
            <input type="email" id="mail_inter_crea" name="mail_inter_crea" value="">
            <p> Téléphone </p>
            <input type="number" id="tel_inter_crea" name="tel_inter_crea" value="">
            <p> Fax </p>
            <input type="number" id="fax_inter_crea" name="fax_inter_crea" value="">
            <p> Choisissez votre domaine </p>
            <input type="radio" name="choix" value="Alarme_incendie">
            <input type="radio" name="choix" value="Alarme_intrusion">
            <input type="radio " name="choix" value="Chauffage">           
            <button id="submit" class="button"> Modifier</button>
            <button id="submit" class="button"> Annuler</button>
          </form>
        </fieldset>
        <div class="clear"> </div>
      </div>
    </div>

Afficher la suite

2 réponses

Réponse 1 / 2
Bouum Messages postés 5 Statut Membre

Salut,

Un truc comme ça?

<br> <input type="radio" name="choix" value="Alarme_incendie"> Alarme incendie
<input type="radio" name="choix" value="Alarme_intrusion"> Alarme intrusion
<input type="radio" name="choix" value="Chauffage"> Chauffage </br>
<p> <button id="submit" class="button">Modifier</button> </p>
<button id="submit" class="button"> Annuler</button>
</form>
</fieldset>
<div class="clear"> </div>
</div>
</div>
0
1. tatiana006 Messages postés 6 Statut Membre
  
  Bonjour, merci mais j'ai toujours le même problème, rien n'est aligné.. Le nom du choix ne s'aligne pas mais il est tout décalé .
  Je ne sais pas quoi mettre dans mon CSS dans ce cas la
  
  0
Réponse 2 / 2
Pitet Messages postés 2845 Statut Membre 530
Salut,

Une bonne pratique est d'utiliser la balise html label :
```
<label>
  <input type="radio" name="choix" value="Alarme_incendie"> Alarme incendie
</label>
<label>
  <input type="radio" name="choix" value="Alarme_intrusion"> Alarme instrusion
</label>
<label>
  <input type="radio" name="choix" value="Chauffage"> Chauffage
</label>
```
Cela permet en plus à l'utilisateur de cliquer sur le mot "Chauffage" et pas uniquement sur le radio.

Bonne journée
0
1. tatiana006 Messages postés 6 Statut Membre
  
  Bonjour merci j'ai essayé également avec label et toujours le même problème
  
  0
2. Pitet Messages postés 2845 Statut Membre 530
  
  Il s'agit de l'affichage par défaut sans css : https://jsfiddle.net/uv281zrj/
  
  Peux t-on voir ton code css ?
  
  0
  1. tatiana006 Messages postés 6 Statut Membre > Pitet Messages postés 2845 Statut Membre
    
    #formulaire input {
    background:#195f88;
    
    }
    fieldset#formulaire {
    width:100%;
    float:left
    }
    fieldset#formulaire textarea {
    width:97.5%;
    background:#195f88;
    height:150px
    }
    
    0
3. tatiana006 Messages postés 6 Statut Membre
  
  voici la partie sur les formulaires
  
  0
4. Pitet Messages postés 2845 Statut Membre 530
  
  Pourtant en utilisant ton code css, les libellés des choix s'affiche bien à coté des radios : https://jsfiddle.net/uv281zrj/1/
  
  0

Bouton radio dans un formulaire

2 réponses

Discussions similaires

Newsletters