# CSS: The @charset rule may only occur at the start of the style sheet. Please check that there are no spaces before it.

> Canonical HTML version: https://rocketvalidator.com/html-validation/css-the-charset-rule-may-only-occur-at-the-start-of-the-style-sheet-please-check-that-there-are-no-spaces-before-it
> Attribution: Rocket Validator (https://rocketvalidator.com)
> License: CC BY 4.0 (https://creativecommons.org/licenses/by/4.0/)

The `@charset` rule in a `<style>` element is not valid because `@charset` only applies to external CSS files, not inline styles.

When CSS is embedded inside a `<style>` element, the character encoding is already determined by the HTML document itself (through the `<meta charset>` declaration or the HTTP `Content-Type` header). The `@charset` rule has no effect in this context, and the W3C validator flags it as an error.

This error also appears when `@charset` is present in an external `.css` file but is not on the very first line, or has a space or BOM (byte order mark) before it. In external stylesheets, `@charset` must be the absolute first thing in the file, with no preceding whitespace or comments.

## How to fix it

If the `@charset` rule is inside a `<style>` element, remove it:

```html
<!-- Wrong: @charset inside a style element -->
<style>
  @charset "UTF-8";
  body {
    color: #333;
  }
</style>

<!-- Fixed: remove the @charset rule -->
<style>
  body {
    color: #333;
  }
</style>
```

If the `@charset` rule is in an external stylesheet, make sure it is on the very first line with no preceding spaces, BOM characters, or comments:

```css
@charset "UTF-8";
body {
  color: #333;
}
```