# Bad value “X” for attribute “media” on element “link”: unrecognized media “X”.

> Canonical HTML version: https://rocketvalidator.com/html-validation/bad-value-x-for-attribute-media-on-element-link-unrecognized-media-x
> Attribution: Rocket Validator (https://rocketvalidator.com)
> License: CC BY 4.0 (https://creativecommons.org/licenses/by/4.0/)

The `media` attribute on a `<link>` element specifies the conditions under which the linked resource should apply. It accepts either a simple media type or a full media query. When the validator reports "unrecognized media," it means the value you provided doesn't match any known media type or valid media query syntax.

Several older media types that were defined in earlier CSS specifications have been deprecated. Types like `handheld`, `projection`, `tv`, `tty`, `aural`, `braille`, and `embossed` are no longer recognized as valid. Modern CSS and HTML only support three media types: `all`, `screen`, and `print`. If you're using a deprecated type, you should replace it with an appropriate modern media query that targets the device characteristics you need.

Beyond deprecated types, this error also occurs when a media query expression is malformed — for example, missing parentheses around a feature expression, using an unknown feature name, or having a typo in the value.

## Why this matters

- **Standards compliance**: Using unrecognized media types means your HTML doesn't conform to the current HTML and CSS specifications.
- **Browser behavior**: Browsers may ignore the entire `<link>` element or apply the resource unconditionally when they encounter an unrecognized media type, leading to unexpected results.
- **Performance**: The `media` attribute helps browsers prioritize resource loading. A valid media query allows the browser to defer loading stylesheets that don't match the current context (e.g., print stylesheets), improving page load performance.

## How to fix it

1. **Replace deprecated media types** with `screen`, `print`, or `all`, or use modern media queries that target specific device features.
2. **Check for typos** in your media type or query expression.
3. **Validate your media query syntax** — feature expressions must be wrapped in parentheses and use recognized feature names like `max-width`, `orientation`, or `prefers-color-scheme`.

## Examples

### Incorrect: using a deprecated media type

```html
<link rel="stylesheet" href="mobile.css" media="handheld">
```

The `handheld` media type is deprecated and will trigger the validation error.

### Incorrect: misspelled media type

```html
<link rel="stylesheet" href="styles.css" media="screen">
```

### Incorrect: malformed media query

```html
<link rel="stylesheet" href="responsive.css" media="max-width: 768px">
```

The feature expression is missing its surrounding parentheses.

### Correct: using valid media types

```html
<link rel="stylesheet" href="general.css">
<link rel="stylesheet" href="print.css" media="print">
<link rel="stylesheet" href="screen.css" media="screen">
```

When no `media` attribute is specified, it defaults to `all`.

### Correct: replacing deprecated types with modern media queries

Instead of `media="handheld"`, use a media query that targets small screens or specific device capabilities:

```html
<link rel="stylesheet" href="mobile.css" media="screen and (max-width: 768px)">
```

### Correct: using complex media queries

```html
<link rel="stylesheet" href="dark.css" media="(prefers-color-scheme: dark)">
<link rel="stylesheet" href="portrait.css" media="screen and (orientation: portrait)">
<link rel="stylesheet" href="large.css" media="screen and (min-width: 1200px)">
```

### Valid media types reference

| Media type | Description |
|---|---|
| `all` | Matches all devices (default when omitted) |
| `print` | Matches printers and print preview mode |
| `screen` | Matches screens (computers, tablets, phones) |

For anything more specific than these three types, use media feature expressions like `(max-width: 600px)`, `(hover: hover)`, or `(prefers-reduced-motion: reduce)` to target the exact device characteristics you need.