# CSS: “margin-bottom”: “spacing(N)” is not a “margin-bottom” value.

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

The `spacing()` function is not a valid CSS value. It does not exist in any CSS specification.

The `spacing()` notation is commonly found in utility-based frameworks like Tailwind CSS or custom design systems where it acts as a shorthand for spacing scales. However, browsers and the W3C validator do not recognize it as valid CSS.

If you're using a build tool or preprocessor, make sure `spacing()` is being compiled into a valid CSS value before it reaches the browser. If you're writing plain CSS, replace it with a standard CSS length value such as `px`, `rem`, `em`, or use a CSS custom property.

## How to Fix

Replace `spacing(3)` with a valid CSS length value:

```css
#content::after {
  margin-bottom: 0.75rem;
}
```

Or use a CSS custom property to create your own spacing scale:

```css
:root {
  --spacing-3: 0.75rem;
}

#content::after {
  margin-bottom: var(--spacing-3);
}
```

Both approaches produce valid CSS that the W3C validator will accept. If your project relies on a framework that provides `spacing()`, check that your build pipeline (e.g., PostCSS, Sass, or Tailwind) is correctly transforming it into standard CSS before deployment.
