Use a CSS Class to Style an Element - Unable to set h2 to red

1

Hello,

I have seen many questions like this and explanations that doesn’t solve my problem. In the task is clearly said “Do not use inline style declarations like style=“color: red” in your h2 element.”

Unable to change the h2 to red.

Thanks!

Your code so far

 h2 .red-text {
    color:red;
  }
</style>

<h2>CatPhotoApp</h2>
<p>Kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff.</p>

Your browser information:

Your Browser User Agent is: Mozilla/5.0 (Windows NT 10.0; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/63.0.3239.84 Safari/537.36.

Link to the challenge:
https://www.freecodecamp.org/challenges/use-a-css-class-to-style-an-element

2

You have to add the class attribute to the <h2> element and give it the red-text class.

<h2 class="red-text">

Then in the CSS, it’s just .red-text, not h2 .red-text. It’s valid syntax, but it has an entirely different meaning.

3

Thanks a lot! It worked.

I understood I had to avoid using <h2 class="red-text">
Just started learning.

4

Others have suggested adding an inline style to the <h2> tag.

Me, I’d just change your selector. You could either do this:

h2 {
  color: red;
}

or

.red-text {
  color: red;
}
</style>

<h2 class="red-text">...</h2>
1 Like
5

Thanks a lot! Now when I went through more exercises everything makes more sense!

1 Like