# CSS: “--wp--style--global--wide-size”: The types are incompatible.

> Canonical HTML version: https://rocketvalidator.com/html-validation/css-wp-style-global-wide-size-the-types-are-incompatible
> Attribution: Rocket Validator (https://rocketvalidator.com)
> License: CC BY 4.0 (https://creativecommons.org/licenses/by/4.0/)

The value of the `--wp--style--global--wide-size` custom property has a math expression that combines values of incompatible types.

WordPress block themes create this variable from the wide width in `theme.json` (`settings.layout.wideSize`), or from the wide width set in the Site Editor. It controls how far blocks with the "Wide width" alignment can stretch. WordPress copies the value into a `<style>` element as is, so the validator checks exactly what the theme or the site settings contain.

A custom property can hold almost any value, and the validator doesn't check whether the result is a length. It does check the math inside `calc()`, `min()`, `max()` and `clamp()`, where every value you add, subtract or compare must have the same type. A unitless number next to a length breaks that rule, as in `calc(1200px - 40)` or `clamp(800px, 90vw, 1200)`. Browsers reject those expressions too: any property that reads the variable through `var()` becomes invalid at computed-value time and acts as if it were unset. Wide blocks then lose their maximum width.

To fix the error, edit `wideSize` in `theme.json` (or the wide width in the Site Editor) and add the missing unit.

## Invalid example

```html
<style>
  body {
    --wp--style--global--wide-size: calc(1200px - 40);
  }
</style>
```

## Valid example

```html
<style>
  body {
    --wp--style--global--wide-size: calc(1200px - 40px);
  }
</style>
```