HTML Guides for invalid

A CSS selector in your style element or style attribute contains an ID that doesn’t follow valid CSS syntax rules.

In CSS, ID selectors must begin with a # followed by a valid CSS identifier. A valid CSS identifier cannot start with a digit, two hyphens, or a hyphen followed by a digit, unless the identifier is properly escaped. This error commonly occurs when your HTML element has an id that begins with a number (like id="1section") and your CSS references it directly as #1section.

While HTML5 allows id values to start with numbers, CSS does not accept those values as-is in selectors. You have two options: rename the id to start with a letter or underscore, or escape the leading digit in your CSS selector using a backslash (e.g., #\31 section). Renaming the id is almost always the simpler and more maintainable approach.

Invalid ID selector

<style>
  #1section {
    color: red;
  }
</style>

<div id="1section">Hello</div>

Fixed: Use a valid identifier

<style>
  #section-1 {
    color: red;
  }
</style>

<div id="section-1">Hello</div>

If you cannot change the id in the HTML, escape the digit in CSS:

<style>
  #\31 section {
    color: red;
  }
</style>

<div id="1section">Hello</div>

The \31 is the Unicode code point for the character “1”, and the space after it separates the escape sequence from the rest of the identifier. This is valid CSS but harder to read, so renaming the id is the preferred fix.