# Bad value X for attribute “sizes” on element “img”: Bad media condition: only “0” can be a “unit”. You must put a unit after your numbe at Y.

> Canonical HTML version: https://rocketvalidator.com/html-validation/bad-value-x-for-attribute-sizes-on-element-img-bad-media-condition-only-0-can-be-a-unit-you-must-put-a-unit-after-your-numbe-at-y
> Attribution: Rocket Validator (https://rocketvalidator.com)
> License: CC BY 4.0 (https://creativecommons.org/licenses/by/4.0/)

A `sizes` attribute on an `<img>` element contains a media condition where a number is missing its CSS unit (like `px`, `em`, or `rem`).

The `sizes` attribute tells the browser how wide an image will be displayed at different viewport sizes, so it can pick the best source from a `srcset`. Each entry in `sizes` is a media condition paired with a length value. The media conditions follow standard CSS media query syntax, which means all non-zero numeric values must include a unit.

A common mistake is writing something like `(max-width: 600)` instead of `(max-width: 600px)`. In CSS, bare numbers without units are invalid except for `0`, which doesn't need a unit because zero pixels, zero ems, and zero rems are all the same thing.

## Example with the error

```html
<img
  src="photo.jpg"
  srcset="photo-480.jpg 480w, photo-800.jpg 800w"
  sizes="(max-width: 600) 480px, 800px"
  alt="A sunset over the ocean">
```

The media condition `(max-width: 600)` is missing a unit after `600`.

## Fixed example

```html
<img
  src="photo.jpg"
  srcset="photo-480.jpg 480w, photo-800.jpg 800w"
  sizes="(max-width: 600px) 480px, 800px"
  alt="A sunset over the ocean">
```

Adding `px` (or whichever unit is appropriate) to the number in the media condition resolves the error. This applies to every numeric value in the media condition, not just the length that follows it. For example, `(min-width: 40em) 50vw, 100vw` is also valid.