Comment puis-je contrôler la largeur d'une étiquette?

L'utilisation du bloc inline est préférable car elle ne force pas les éléments et/ou contrôles restants à être dessinés dans une nouvelle ligne.

label {
  width:200px;
  display: inline-block;
}

Éléments en ligne (comme SPAN, LABEL, etc.) sont affichés de sorte que leur hauteur et leur largeur sont calculées par le navigateur en fonction de leur contenu. Si vous voulez contrôler la hauteur et la largeur, vous devez changer les blocs de ces éléments.

display: block; rend l'élément affiché comme un bloc solide (comme les balises DIV), ce qui signifie qu'il y a un saut de ligne après l'élément (il n'est pas inline). Bien que vous puissiez utiliser display: inline-block pour résoudre le problème du saut de ligne, Cette solution ne fonctionne pas dans IE6 car IE6 ne le fait pas reconnaître inline-bloc. Si vous voulez qu'il soit compatible avec tous les navigateurs, regardez cet article: http://webjazz.blogspot.com/2008/01/getting-inline-block-working-across.html

Donner de la largeur à L'étiquette n'est pas une bonne façon. vous devriez prendre une structure div ou table pour gérer cela. mais si vous ne voulez pas changer votre code entier, vous pouvez utiliser le code suivant.

label {
  width:200px;
  float: left;
}

label {
  width:200px;
  display: inline-block;
}

OR 

label {
  width:200px;
  display: inline-flex;
}

OR 

label {
  width:200px;
  display: inline-table;
}

Vous pouvez soit donner un nom de classe à all label afin que tous puissent avoir la même largeur:

 .class-name {  width:200px;}

Exemple

.labelname{  width:200px;}

Ou vous pouvez simplement donner le reste de l'Étiquette

label {  width:200px;  display: inline-block;}