Use a CSS Class to Style an Element, my h2 doesn't change to red

1

Tell us what’s happening:

Your code so far

<style>
 <h2> class="red-text">catPhotoApp</h2>
    
</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/55.0.2883.87 UBrowser/7.0.125.1001 Safari/537.36.

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

2

a few things wrong here.
First, your putting HTML content inside of your style tag. Consider the style tag as a pocket of CSS content.
The challenge wants you to add the .red-text class to the h2 tag.

That would look something like this.

<h2 class="red-text">CatPhotoApp</h2>

Note that the class part is inside of the opening h2 tag. <h2 class="red-text"></h2>
So instead of adding anything to the stylesheet, were just adding class="red-text" to the opening tag of the h2.

This leaves us to the styling part. Here we select the h2 tag that has a class of red-text and give it text color of red.
It would look more like this.

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

The .red-text part says that we are looking for an h2 tag with a class of .red-text. The period before red text is what tells our browser that red-text is a class.

If you need help grasping this, I would check out this site for basic css syntax.
Just stick with freecodecamp for the bulk of it.
http://www.cssbasics.com/css-syntax/

Once you look at it for long enough it’ll click :slight_smile:

3

thank you for the response but i still don’t understand this… do i have to add

h2.red-text { color: red; }

to it