Bonjour,

J'ai un formulaire dans un bloc sur lequel j'ai appliquer la propriété align="center" pour centrer horizontalement mon bloc dans ma page.

Mon problème en faisant cela, c'est qu'il y a aussi un centrage des éléments de mon formulaire. En utilisant un float : left, cela me permet de mettre à gauche mon texte, mais cela ne marche pas sur les contrôles (liste déroulante - zone de texte - boutons ).

Je vous met mon code HTML :

Code HTML : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
<div id="labelzone" align="center">
    <div id="Panel1" style="background: #A8C1DF; width: 450px;height:300px;">
 
 
       <p class="texte">Identification</p> <hr />
 
        <br />
    <label for="DropDownList1"> Site :</label>
         <div class="champformulaire"> 
       <select name="DropDownList1" id="DropDownList1" style="width:165px;">
		<option value="">-- Choisissez un Site  --</option>
		<option value="site1">site1</option>
		<option value="site2">site2</option>
		<option value="site3">site3</option>
 
	</select>
       </div> 
 
      <br /><br />
 
    <label for="DropDownList2"> Nom  :</label> 
       <div class="champformulaire"> 
          <select name="DropDownList2" id="DropDownList2" style="width:165px;">
		<option value="">-- Choisissez un Nom --</option>
		<option value="Nom1">Nom1</option>
		<option value="Nom2">Nom2</option>
		<option value="Nom3">Nom3</option>
 
	</select>
      </div>
     <br /><br /> 
   <label for="TextBox1"> Mot de passe :</label>  
      <div class="champformulaire"> <input name="TextBox1" type="password" id="TextBox1" style="width:160px;" /></div> 
 
 
     <br /><br />
        <div id="labelbouton">  
         <input type="submit" name="Bouton_connexion" value="Connexion" onclick="javascript:WebForm_DoPostBackWithOptions(new WebForm_PostBackOptions(&quot;Bouton_connexion&quot;, &quot;&quot;, true, &quot;&quot;, &quot;&quot;, false, false))" id="Bouton_connexion" style=" width: 6em" /> &nbsp;
         <input name="Reset2" type="reset" id="Reset2" value="Annuler" style=" width: 6em" /> 
        </div>  
 
 
</div>
 
 
    </div>

Et le code css associé :

#labelzone
{
margin-top : 5%;
}

Code CSS : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
/*Alignement des champs du formulaire d'identification*/
label 
{
display:block;
width:35%;
float:left;  
color: #32639A;
font-weight:bold;
padding: 2px;
margin-left: 2%;
text-align:left;
}
 
/*Définition du style des contôles*/    
.champformulaire :
{
  margin-left:10px; 
  text-align:left; 
}

Si quelqu'un peut me dire comment annuler cet effet d'alignement sur les éléments de mon formulaire.

Merci.