CSS Class not formatable while ID works - html

Question

I am learning HTML and CSS and I found one weird thing, despite training that I watch, and copy this step by step(using Visual Studio Code) I am unable to apply any style to any part of HTML file, when I add a Class to it. However, if I add ID, style applies.
My setting:
Visual Studio Code
Separate CSS and HTML File.
Example of not working code:
<div Class="Author">
<h1> About the Author</h1>
<img src="image link here">
</div>
however, if I change above code to this:
<div ID="Author">
<h1> About the Author</h1>
<img src="image link here">
</div>
This does work.
Yes, I do change properly the CSS file to be either "." or "#" is there anything I miss here?

Answer 1

I don't think this works:
<div Class="Author">
it should be lowercase:
<div class="Author">
and then in the css reference it like
.Author {color: red}

Answer 2

This functions correctly. You didn't give us css to work from so this is the best I can offer.
#Author {
color: red;
}
.Author {
color: blue;
}
<!-- no css applied -->
<div ID="no_css">
<h1> About the Author</h1>
<img src="image link here">
</div>
<!-- css applied to `ID` using `#` -->
<div ID="Author">
<h1> About the Author</h1>
<img src="image link here">
</div>
<!-- css applied to `Class` using `.` -->
<div Class="Author">
<h1> About the Author</h1>
<img src="image link here">
</div>