# CSS: “max-width”: “px” is not a “max-width” value.

> Canonical HTML version: https://rocketvalidator.com/html-validation/css-max-width-px-is-not-a-max-width-value
> Attribution: Rocket Validator (https://rocketvalidator.com)
> License: CC BY 4.0 (https://creativecommons.org/licenses/by/4.0/)

A `max-width` declaration has the unit `px` with no number in front of it, so the browser can't read it as a length.

A CSS length is a number followed by a unit, written together: `600px`, `40rem`, `75ch`. The unit alone means nothing. Browsers drop the invalid declaration, so the element falls back to `max-width: none` and can grow wider than you intended.

The cause is usually a template that prints a number variable right before a hard-coded `px`. When the variable is empty, the output is `max-width: px;`. Make sure the variable always holds a number, or leave the declaration out when there's no value. If you want no limit at all, use `none`.

The number and the unit can't be separated by a space either. `max-width: 600 px;` triggers a different validator error, "Too many values or values are not recognized".

## Invalid example

```html
<div style="max-width: px;">
  <p>This text block has no width limit.</p>
</div>
```

## Valid example

```html
<div style="max-width: 600px;">
  <p>This text block stops growing at 600 pixels.</p>
</div>
```