Propiedad width del estilo

Definición y uso

propiedad width Establecer o devolver el ancho del elemento.

propiedad width Esta propiedad solo es válida para elementos de bloque o elementos con alineación absoluta o fija. El contenido que se desborda se puede configurar con Propiedad overflow para manejar.

Consejo:Utilice Propiedad height Establecer o devolver la altura del elemento.

Vea también:

Tutoriales de CSS:Dimensión CSS

Tutoriales de CSS:Modelo de cuadro CSS

Manual de referencia de CSS:Propiedad width

Ejemplo

Ejemplo 1

Configurar el ancho del elemento <button>:

document.getElementById("myBtn").style.width = "300px";

Pruebe usted mismo

Ejemplo 2

Cambiar el ancho del elemento <div>:

document.getElementById("myDIV").style.width = "500px";

Pruebe usted mismo

Ejemplo 3

Cambiar el ancho y la altura del elemento <img>:

document.getElementById("myImg").style.height = "300px";
document.getElementById("myImg").style.width = "300px";

Pruebe usted mismo

Ejemplo 4

Devuelve el ancho del elemento <img>:

alert(document.getElementById("myImg").style.width);

Pruebe usted mismo

Sintaxis

Devolver la propiedad width:

object.style.width

Configurar la propiedad width:

object.style.width = "auto|length|%|initial|inherit"

Valor de la propiedad

Valor Descripción
auto Configura el ancho del navegador. Predeterminado.
length Define el ancho en unidades de longitud.
% Define el ancho del elemento padre en porcentajes.
initial Establece esta propiedad en su valor predeterminado. Consulte initial.
inherit Hereda esta propiedad del elemento padre. Consulte inherit.

Detalles técnicos

Valor predeterminado: auto
Valor devuelto: Cadena que representa el ancho del elemento.
Versión de CSS: CSS1

Navegadores compatibles

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
Soporte Soporte Soporte Soporte Soporte