Killer Johan
Killer Johan

Reputation: 17

CSS class is not applying to div

Here is my code with class .1-html and div

CSS:

.1-html {
    height: 200px;
    width: 200px;
    border: 1px solid #000;
}

HTML:

<div class="1-html">
</div>

Upvotes: 0

Views: 227

Answers (2)

Sagar
Sagar

Reputation: 483

Names starting with number are invalid in CSS so you need to escape the number.

Try this block of code , it's working in my browser

<html>
<head>
<meta charset = "UTF-8" lang="en">
<style>

    [class="1-html"]  {
    height: 200px;
    width: 200px;
    border: 1px solid #000;
}
</style>
</head>
<body>
<div class="1-html">

</div>

</body>
</html>

screenshot of web browser

Upvotes: 1

Mohammed Abrar Ahmed
Mohammed Abrar Ahmed

Reputation: 2490

A name should begin with an underscore (_), a hyphen (-) or a letter(a–z), followed by any number of hyphens, underscores, letters, or numbers. if the first character is a hyphen, the second character must be a letter or underscore, and the name must be at least 2 characters long.

Checkout details at How to name a css class and css selectors

Below code should work or check here.

CSS:

.html-1 {
    height: 200px;
    width: 200px;
    border: 1px solid #000;
}

HTML:

<div class="html-1">
</div>

If you want to use number at the starting of the class name then follow the code below or check here:

CSS:

[class="1html"] {
    height: 200px;
    width: 200px;
    border: 1px solid #000;
}

HTML:

<div class="1html">
</div>

Upvotes: 4

Related Questions