Comment placer le label identifiant à droit?

Sujet résolu

23 mars 2017 à 15:02:40

Bonjour,

Je souhaiterais mettre le label identifiant à droit du coups voici ci-joint le code et une capture d’écran du formulaire.

Merci d'avance!

Cordialement,

                                 <form>
					  <fieldset class="cont-info">
							<legend class="cont-info-legend">
								Informations initiales:
							</legend>
					<div class="row">			
				    <div class="col-md-4">
					<div class="box-body" style="display: block;">
					<div class="form-group">
								<label> Nom<sup>*</sup> :</label>
								<select name="nomajoutuser" id="nomajoutuser" class="form-control" >
									<option value="rien"> Nomuser </option>
									<option value="M"> N </option>
									<option value="M"> E </option>
									<option value="M"> E </option>
									<option value="M"> E </option>
									<option value="M"> N  </option>
									<option value="M"> E </option>
									<option value="M"> N  </option>
									<option value="M"> E  </option>
									<option value="M"> T  </option>
									<option value="M"> Y  </option>
									<option value="M"> T  </option>
									<option value="M"> L </option>
									<option value="G"> O  </option>
									<option value="G"> I </option>
                                    <option value="S"> V </option>
								</select>
								</div>

                            
                            <div class="form-group">
								<label> Identifiant<sup>*</sup> :</label>
								<select name="identuser" id="identuser" class="form-control">
									<option value="rien"> Iden</option>
									<option value="M"> 1 </option>
									<option value="M"> 2 </option>
									<option value="M"> 6 </option>
									<option value="M"> 9 </option>
									<option value="M"> 5 </option>
									<option value="M"> 0 </option>
									<option value="M"> 2 </option>
									<option value="M"> 3 </option>
									<option value="M"> 1 </option>
									<option value="M"> 4 </option>
									<option value="M"> 2 </option>
									<option value="M"> 5 </option>
									<option value="G"> 6 </option>
									<option value="G"> 1 </option>
                                    <option value="S">  </option>
                                 </select>
                                 </div>
					</form>
					</div><!-- /.box -->
				    </div><!-- /.row -->
                    </div><!-- /.col -->
                     </fieldset>

Quentyn

24 mars 2017 à 9:49:59

Bonjour,

Voici la solution à ton problème:

code html:

<html lang="fr">
<head>
    <meta charset="utf-8">
    <link rel="stylesheet" href="test.css"/>
</head>
    <body>
 <form>
  <fieldset class="cont-info">
        <legend class="cont-info-legend">
            Informations initiales:
        </legend>
      
<div class="row">        
<div class="col-md-4">
<div class="box-body" style="display: block;">
<div class="form-group">
            <label> Nom<sup>*</sup> :</label>
            <select name="nomajoutuser" id="nomajoutuser" class="form-control" >
                <option value="rien"> Nomuser </option>
                <option value="M"> N </option>
                <option value="M"> E </option>
                <option value="M"> E </option>
                <option value="M"> E </option>
                <option value="M"> N  </option>
                <option value="M"> E </option>
                <option value="M"> N  </option>
                <option value="M"> E  </option>
                <option value="M"> T  </option>
                <option value="M"> Y  </option>
                <option value="M"> T  </option>
                <option value="M"> L </option>
                <option value="G"> O  </option>
                <option value="G"> I </option>
                <option value="S"> V </option>
            </select>
            </div>
 
         
        <div class="form-group">
            <label> Identifiant<sup>*</sup> :</label>
            <select name="identuser" id="identuser" class="form-control">
                <option value="rien"> Iden</option>
                <option value="M"> 1 </option>
                <option value="M"> 2 </option>
                <option value="M"> 6 </option>
                <option value="M"> 9 </option>
                <option value="M"> 5 </option>
                <option value="M"> 0 </option>
                <option value="M"> 2 </option>
                <option value="M"> 3 </option>
                <option value="M"> 1 </option>
                <option value="M"> 4 </option>
                <option value="M"> 2 </option>
                <option value="M"> 5 </option>
                <option value="G"> 6 </option>
                <option value="G"> 1 </option>
                <option value="S">  </option>
             </select>
             </div>

</div><!-- /.box -->
</div><!-- /.row -->
</div><!-- /.col -->
    
 </fieldset>
 </form>
 </body> 
 </html>

code css:

.form-group {
display: inline-block;
display: table-cell;
}

Ici j'ai appelé ma page CSS test après tu peux l'appeler comme tu veux, il faudra juste que modifie le lien CSS.

Je pense que c'est le résultat que tu voulais:

-
Edité par Quentyn 24 mars 2017 à 15:16:01

Si debugger, c'est supprimer des bugs, alors programmer ne peut être que les ajouter. Edsger Dijkstra

ab39

24 mars 2017 à 10:44:20

Merci pour la réponse je vais l’essayer et je vous dirai je pense que ça va marcher normalement.

A plus!

Cordialement,

Robert Demangeon

24 mars 2017 à 11:00:20 - Message modéré pour le motif suivant : Message complètement hors sujet

Antonin Drouet

24 mars 2017 à 11:02:31 - Message modéré pour le motif suivant : réponse à un message hors sujet

AbcAbc6

24 mars 2017 à 12:52:02

@Quentyn bonjour, dans votre réponse vous fermer le formulaire trop tôt, c'est après le fieldset. Pour ce qui est de la CSS c'est soit un float soit un display mais pas les deux.

Quentyn

24 mars 2017 à 15:10:22

bonjour,

J'ai juste repris son formulaire comme exemple au niveau du html mais pour faire plaisir je rectifie

Après ce qui est du CSS je ne voulais pas mettre float left ceci est effectivement une erreur de ma part.

-
Edité par Quentyn 24 mars 2017 à 15:14:11

Si debugger, c'est supprimer des bugs, alors programmer ne peut être que les ajouter. Edsger Dijkstra

ab39

24 mars 2017 à 15:45:51

Oui tout à fait c'est une erreur car je l'ai essayé ça ne marche pas mais j'ai bricolé des trucs et ça répond à ce que je voulais avoir.

Merci beaucoup et à plus tard!

Cordialement,

AbcAbc6

24 mars 2017 à 16:19:32

effectivement je n'ai pas bien regardé le code de départ

Je passe le sujet en résolu alors.

Bonne continuation,

ab39

27 mars 2017 à 8:58:45

Bonjour,

J'ai pu régler les trucs de label ce qui reste est de le connecter avec la base de données.

Cordialement,