# Bad value for attribute “srcset” on element “img”: No width specified for image X. (When the “sizes” attribute is present, all image candidate strings must specify a width.)

> Canonical HTML version: https://rocketvalidator.com/html-validation/bad-value-for-attribute-srcset-on-element-img-no-width-specified-for-image-x-when-the-sizes-attribute-is-present-all-image-candidate-strings-must-specify-a-width
> Attribution: Rocket Validator (https://rocketvalidator.com)
> License: CC BY 4.0 (https://creativecommons.org/licenses/by/4.0/)

When an `img` element has a `sizes` attribute, every image candidate in the `srcset` attribute must include a width descriptor (like `480w`), not a pixel density descriptor (like `2x`) or a bare URL.

The `srcset` attribute accepts two types of descriptors, but they cannot be mixed, and the choice depends on whether `sizes` is present.

Width descriptors (`w`) tell the browser the actual pixel width of each source image. The browser then uses the `sizes` attribute to determine how much space the image will occupy in the layout and picks the best candidate from `srcset`. This pairing of `srcset` with width descriptors and `sizes` is how responsive image selection works.

Pixel density descriptors (`x`) tell the browser which image to use based on the device's pixel density (e.g., `1x` for standard screens, `2x` for retina). When using density descriptors, the `sizes` attribute has no role and should be omitted.

The validation error appears when `sizes` is present but one or more entries in `srcset` lack a `w` descriptor. A bare URL with no descriptor is treated as `1x` by default, which conflicts with the requirement that `sizes` demands width descriptors.

## Invalid example

```html
<img
  src="photo-800.jpg"
  srcset="photo-400.jpg, photo-800.jpg 2x"
  sizes="(max-width: 600px) 100vw, 50vw"
  alt="A landscape photo">
```

Here, `photo-400.jpg` has no descriptor (defaults to `1x`), and `photo-800.jpg` uses `2x`. Because `sizes` is present, the validator expects every candidate to specify a width.

## Fixed example

```html
<img
  src="photo-800.jpg"
  srcset="photo-400.jpg 400w, photo-800.jpg 800w"
  sizes="(max-width: 600px) 100vw, 50vw"
  alt="A landscape photo">
```

Each candidate now includes a width descriptor that reflects the image's intrinsic width in pixels. The browser compares these widths against the resolved `sizes` value to choose the most appropriate source.

If you do not need `sizes` and just want to serve different images for different pixel densities, drop the `sizes` attribute and use density descriptors instead:

```html
<img
  src="photo-400.jpg"
  srcset="photo-400.jpg 1x, photo-800.jpg 2x"
  alt="A landscape photo">
```