La etiqueta de la etiqueta no tiene la propiedad ‘width’, entonces, ¿cómo puedo controlar el ancho de una etiqueta?

  • La etiqueta es un elemento en línea, no puede tener valor de ancho; para hacer esto usted necesita para poner display:block o float:left.
InformationsquelleAutor ziiweb | 2010-05-12

7 Comentarios

  1. 179

    El uso de CSS, por supuesto…

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

    La width atributo está en desuso, y CSS siempre debe ser utilizado para el control de estos tipos de estilos de presentación.

    • Pero que conduce a una ruptura en el código, que es probablemente lo que el OP no quiero en primer lugar.
    • A continuación, el OP puede utilizar float o display: inline-block
    • Sí, eso es lo que quería conseguir en. 🙂 Este es el aspecto central aquí, ya que es la parte difícil. El mero establecimiento de width no tiene mucho uso.
    • Lo siento, no obtener el texto a la derecha. He eliminado mi comentario para evitar la confusión de otros lectores!
    • oh shiiiiit….. inline-block nunca solía trabajar para mí, traté de flotador y acam! me pregunto por qué inline-block hizo no trabajo para mí
    • inline-block no ignora los espacios en blanco, que podría ser la razón por la que estaban teniendo problemas con él.

  2. 86

    Utilizando el inline-block es mejor porque no forzar al resto de los elementos y/o controles a ser elaborado en una nueva línea.

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

    Los elementos en línea (como SPAN, ETIQUETA, etc.) se muestran, de manera que su altura y la anchura se calcula por el navegador basado en su contenido. Si desea controlar la altura y la anchura de tener que cambiar los elementos de los bloques.

    display: block; hace que el elemento se muestra como un bloque sólido (como las etiquetas DIV), lo que significa que hay un salto de línea después de que el elemento (no en línea). Aunque puede utilizar display: inline-block para solucionar el problema del salto de línea, esta solución no funciona en IE6 porque IE6 no reconoce inline-block. Si usted quiere que sea cross-browser compatible, a continuación, mira este artículo: http://webjazz.blogspot.com/2008/01/getting-inline-block-working-across.html

  4. 4

    Dando el ancho de la Etiqueta no es la manera correcta. usted debe tomar un div o estructura de la tabla para manejar esto. pero aún si usted no desea cambiar su código en su totalidad, a continuación, puede utilizar el código siguiente.

    label {
      width:200px;
      float: left;
    }
    • «Dar el ancho de la Etiqueta no es una forma correcta» de control de la anchura de un elemento label? Estás seguro?
    • Sí .. Porque cuando queremos crear algún diseño o estructura específica, a continuación, div y propiedades de la tabla se proporcionan para su uso. La etiqueta no está pensada para dar el ancho o la altura .. por lo que si utilizamos algo que no está destinado a hacerlo .. va a empezar a crear problemas en alguna manera. Espero tener sentido ahora.
  5. 2
    label {
      width:200px;
      display: inline-block;
    }
    
    OR 
    
    label {
      width:200px;
      display: inline-flex;
    }
    
    OR 
    
    label {
      width:200px;
      display: inline-table;
    }
  6. 0

    Puede dar el nombre de la clase para toda la etiqueta, de modo que todos pueden tener el mismo ancho :

     .class-name {  width:200px;}

    Ejemplo

    .labelname{  width:200px;}

    o usted simplemente puede dar el resto de la etiqueta

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

Dejar respuesta

Please enter your comment!
Please enter your name here