# CSS: “background”: only “0” can be a “length”. You must put a unit after your number.

> Canonical HTML version: https://rocketvalidator.com/html-validation/css-background-only-0-can-be-a-length-you-must-put-a-unit-after-your-number
> Attribution: Rocket Validator (https://rocketvalidator.com)
> License: CC BY 4.0 (https://creativecommons.org/licenses/by/4.0/)

A position in the `background` shorthand is a plain number like `10`, and CSS only accepts a number without a unit when it is `0`.

In `background: url(banner.png) no-repeat 10 20`, the two numbers set `background-position`, which takes lengths such as `10px` or `1.5em`, percentages, or keywords like `left` and `center`. CSS has no default unit, so `10` alone is not a length. Browsers ignore the whole declaration, and the element loses its background color and image along with the position.

The bare number often comes from a template or CMS setting that prints an offset without `px`, or from a value copied out of a design tool. Add the unit you meant, or switch to a percentage or keyword. `0` is the one number that is valid on its own, because zero is the same length in every unit.

The validator words two close cases differently. A unitless size after the slash, as in `center / 100 auto`, is reported as a "unit" error instead of a "length" one. A unitless number that comes second, after a valid first position such as `10px 20`, is reported as not being a `background` value. Adding the unit fixes both.

## Invalid example

```html
<div style="background: url(banner.png) no-repeat 10 20;">
  <p>Summer sale</p>
</div>
```

## Valid example

```html
<div style="background: url(banner.png) no-repeat 10px 20px;">
  <p>Summer sale</p>
</div>
```
