Aod Ren
Aod Ren

Reputation: 679

css background color of a class not working

I have this code in my page :

.0 {
  background-color: blue;
}
.1 {
  background-color: red;
}
<div class="1">Ma ligne</div>
<div class="0">Ma ligne</div>
<div class="1">Ma ligne</div>
<div class="0">Ma ligne</div>
<div class="1">Ma ligne</div>
<div class="0">Ma ligne</div>
<div class="1">Ma ligne</div>

I'd like to set a background color changing if class is 0 or 1. But nothing changes. Am I missing something (obvious) ?

The CSS is loaded, other elements of the page are properly set with CSS style.

Upvotes: 1

Views: 818

Answers (3)

Jim
Jim

Reputation: 1147

You can't declare numbers as CSS class. You can however do something like class="_1"

Upvotes: 0

Scott
Scott

Reputation: 5379

Currently, identifiers such as class names cannot start with numbers. Hopefully this will change in the future as browsers move to implement the HTML5 spec fully, but sadly this hasn't happened yet.

These rules are common in most languages, and in this case, CSS. Here's a full spec of identifier rules that are common to languages beyond HTML/CSS.

Replace each class with something like .b0, .b1, etc, and it will work.

Upvotes: 1

Scripcariu Catalin
Scripcariu Catalin

Reputation: 1

Try this:

<div class="zero">Ma ligne</div>

        <div class="first">Ma ligne</div>

        <div class="zero">Ma ligne</div>

        <div class="first">Ma ligne</div>

        <div class="zero">Ma ligne</div>

        <div class="first">Ma ligne</div>

and CSS

.zero {
    background-color: blue;

}

.first {
    background-color: red;
}

Upvotes: 0

Related Questions