# CSS: “background”: X is an incorrect operator.

> Canonical HTML version: https://rocketvalidator.com/html-validation/css-background-x-is-an-incorrect-operator
> Attribution: Rocket Validator (https://rocketvalidator.com)
> License: CC BY 4.0 (https://creativecommons.org/licenses/by/4.0/)

A `background` value has a comma or slash where the shorthand doesn't allow one, and the usual cause is a gradient whose color stops have positions but no colors.

Each color stop in `linear-gradient()` or `radial-gradient()` is a color followed by an optional position, such as `#0d47a1 0%`. When a theme setting or template variable that should print the color comes out empty, the generated CSS reads `linear-gradient(90deg, 0%, 100%)`. With no colors left, the commas don't separate color stops anymore, and the validator reports `,` as an incorrect operator. Browsers ignore the whole declaration, so the element gets no background from that rule.

The message can also name `/`. In the `background` shorthand, a slash only goes between a position and a size, as in `center / cover`. Writing `url(photo.jpg) / cover` or `no-repeat / cover`, with no position before the slash, triggers the same error.

When the CSS comes from a template, look at the output rather than the source: fill in the missing colors, or skip the gradient when no colors are set.

## Invalid example

```html
<div style="background: linear-gradient(90deg, 0%, 100%);">
  <p>Banner text</p>
</div>
```

## Valid example

```html
<div style="background: linear-gradient(90deg, #0d47a1 0%, #42a5f5 100%);">
  <p>Banner text</p>
</div>
```