¿Cómo puedo controlar el ancho de una etiqueta de etiqueta?

Question

La etiqueta de etiqueta no tiene la propiedad 'ancho', entonces, ¿cómo debo controlar el ancho de una etiqueta de etiqueta?

Answer 1

El uso de CSS, por supuesto ...

label { display: block; width: 100px; } 

El atributo width está en desuso, y CSS siempre debe ser utilizado para controlar este tipo de estilos de presentación.

Answer 2

Los elementos en línea (como SPAN, LABEL, etc.) se muestran para que el navegador calcule su altura y su ancho en función de su contenido. Si desea controlar el alto y el ancho, debe cambiar los bloques de esos elementos.

display: block; hace que el elemento se muestre como un bloque sólido (como etiquetas DIV) lo que significa que hay un salto de línea después del elemento (no está en línea). Aunque puede usar display: inline-block para solucionar el problema del salto de línea, esta solución no funciona en IE6 porque IE6 no reconoce el bloque en línea. Si desea que sea compatible con varios navegadores, mire este artículo: http://webjazz.blogspot.com/2008/01/getting-inline-block-working-across.html

Answer 3

El uso del bloque en línea es mejor porque no obliga a dibujar los elementos y/o controles restantes en una nueva línea.

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

Answer 4

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

OR 

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

OR 

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

Answer 5

Dar ancho de la etiqueta no es una manera adecuada. debe tomar una estructura div o tabla para administrar esto. pero aún así, si no quiere cambiar todo su código, puede usar el siguiente código.

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

Answer 6

Usted puede dar el nombre de clase a todos etiqueta de modo que todos puedan tener el mismo ancho:

.class-name { width:200px;} 

Ejemplo

.labelname{ width:200px;} 

o que pueda sencillo dar resto de la etiqueta

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