# Bad value “auto, X” for attribute “sizes” on element “source”: Bad CSS number token: Expected a minus sign or a digit but saw “a” instead at “auto,”.

> Canonical HTML version: https://rocketvalidator.com/html-validation/bad-value-auto-x-for-attribute-sizes-on-element-source-bad-css-number-token-expected-a-minus-sign-or-a-digit-but-saw-a-instead-at-auto
> Attribution: Rocket Validator (https://rocketvalidator.com)
> License: CC BY 4.0 (https://creativecommons.org/licenses/by/4.0/)

The `auto` keyword is not a valid value for the `sizes` attribute on a `<source>` element according to the W3C HTML validator.

This error typically appears when `sizes="auto, ..."` is used, often copied from lazy-loading patterns. The `sizes` attribute expects a comma-separated list of entries, where each entry is an optional media condition followed by a CSS length value. The value `auto` is not a recognized CSS length or source size descriptor, so the validator flags it whether used alone or combined with other entries.

To fix this, remove `auto` from the `sizes` attribute and use explicit media conditions with CSS length values instead.

## How to fix

This source triggers the validation error:

```html
<picture>
  <source
    srcset="image-640.jpg 640w, image-1024.jpg 1024w"
    sizes="auto, (max-width: 1024px) 100vw, 1024px">
  <img src="image-1024.jpg" alt="Example" loading="lazy">
</picture>
```

Remove `auto` and use explicit media conditions:

```html
<picture>
  <source
    srcset="image-640.jpg 640w, image-1024.jpg 1024w"
    sizes="(max-width: 1024px) 100vw, 1024px">
  <img src="image-1024.jpg" alt="Example" loading="lazy">
</picture>
```