# CSS: “font-size”: X is not a “font-size” value.
> Canonical HTML version: https://rocketvalidator.com/html-validation/css-font-size-x-is-not-a-font-size-value
> Attribution: Rocket Validator (https://rocketvalidator.com)
> License: CC BY 4.0 (https://creativecommons.org/licenses/by/4.0/)
The `font-size` property defines the size of text in CSS and accepts a specific set of value types. When the W3C validator reports that a value "is not a `font-size` value," it means the value you provided doesn't match any of the accepted formats. Browsers may attempt to ignore or guess what you meant, but this leads to unpredictable rendering across different browsers and devices.
This error commonly occurs for a few reasons:
- **Missing units on numeric values.** Writing `font-size: 16` instead of `font-size: 16px`. In CSS, unitless numbers (other than `0`) are not valid lengths.
- **Typos in units or keywords.** For example, `font-size: 16xp`, `font-size: 1.2erm`, or `font-size: lage`.
- **Using values from the wrong property.** For example, `font-size: bold` (which belongs to `font-weight`) or `font-size: center`.
- **Invalid or unsupported syntax.** For example, `font-size: 16 px` (with a space between the number and unit) or `font-size: auto` (which is not valid for this property).
### Valid `font-size` value types
| Type | Examples | Notes |
|---|---|---|
| Absolute keywords | `xx-small`, `x-small`, `small`, `medium`, `large`, `x-large`, `xx-large`, `xxx-large` | Browser-defined sizes |
| Relative keywords | `smaller`, `larger` | Relative to the parent element's font size |
| Length units | `16px`, `1.2em`, `0.9rem`, `12pt`, `1vw` | Must include a unit (except `0`) |
| Percentages | `100%`, `120%`, `80%` | Relative to the parent element's font size |
| Math functions | `calc(1rem + 2px)`, `clamp(1rem, 2vw, 3rem)` | CSS math expressions that resolve to a length |
## Examples
### Incorrect: missing unit on a number
```html
This triggers a validation error.
```
The value `16` is not valid because it lacks a CSS unit. Browsers may ignore this declaration entirely, leaving the text at its default or inherited size.
### Correct: number with a valid unit
```html
This text has a valid font size.
```
### Incorrect: typo in the unit
```html
Typo in the unit.
```
### Correct: proper `em` unit
```html
Correct em unit.
```
### Incorrect: value from the wrong property
```html
Bold is not a font-size value.
```
### Correct: using a valid keyword
```html
Using a valid size keyword.
```
### Incorrect: space between number and unit
```html
Space before the unit is invalid.
```
### Correct: no space between number and unit
```html
No space between number and unit.
```
### Full document example
```html
Font Size Example
Valid heading size
Body text at 1em.
Small print at 80%.
Responsive text using clamp().
```
To resolve this validation error, review every `font-size` declaration in your CSS or inline styles. Make sure each value is either a recognized keyword, a number immediately followed by a valid unit, a percentage, or a supported CSS function like `calc()`. If you intended `0`, that is the one numeric value that does not require a unit — `font-size: 0` is valid, though rarely useful in practice.