H1 tag not inheriting CSS styles

Question

My h1 tag is not getting styles of my css.

<h1 class=123>ExampleText</h1>

I targetted this is and it still doesn't allow me to change the properties of the h1 tag.

Please share some example code or something so we can reproduce the issue and get more detail about the problem. — Charlie Fish, Jul 03 '16 at 20:44
So i have made a h1 tag, and gave it a class. The code above is what it looks like I then have used CSS like this .123 { text-size: 15px; text-align: center; } And its not working on my code. — microdawrt, Jul 03 '16 at 20:45
Please see [Which characters are valid in CSS class names/selectors?](http://stackoverflow.com/questions/448981/which-characters-are-valid-in-css-class-names-selectors) — user247702, Jul 03 '16 at 20:46
@SArnab — Not true. Quotes are only required if the value contains certain characters, and that example contains none of them. — Quentin, Jul 03 '16 at 20:46
@Quentin wow, you're right, just checked it in the HTML5 spec. Thanks for the correction! — SArnab, Jul 03 '16 at 20:48

score 3 · Answer 1 · edited May 23 '17 at 12:08

This is simply a invalid CSS class because a CSS class selector can't start with a number

From w3C specs

In CSS, identifiers (including element names, classes, and IDs in selectors) can contain only the characters [a-z0-9] and ISO 10646 characters +00A1 and higher, plus the hyphen (-) and the underscore (_); they cannot start with a digit, or a hyphen followed by a digit. Identifiers can also contain escaped characters and any ISO 10646 character as a numeric code (see next item). For instance, the identifier "B&W?" may be written as "B\&W\?" or "B\26 W\3F".

So nothing related to missing quotes, as others mentioned. Because as @Quentin explained very well in a comment:

Quotes are only required if the value contains certain characters, and that example contains none of them

See this example:

h1 {
  width: 50px;
  height: 50px;
  border: 1px dashed blue;
  float: left
}
.123 {
  background: red
}
.n123 {
  background: lightgreen
}

<h1 class=123></h1>
<h1 class=n123></h1>
<h1 class="123"></h1>
<h1 class="n123"></h1>

That isn't exactly true. A class can start with a number, a CSS class selector cannot — Quentin, Jul 03 '16 at 20:51
you right, I'm going to fix it :) @Quentin thanks for that I wasn't thinking that out of the box :) Fixed — dippas, Jul 03 '16 at 20:51

H1 tag not inheriting CSS styles

1 Answers1