CSS Element and Class Issues

CSS Element and Class Issues
0

#1

Tell us what’s happening:
Im not quite sure what I need to do here. The instructions say my stylesheet should declare a “.red-text” class and set its color to red. Any help would be appreciated

Your code so far

<style>
  h2 {
    color: red;
  }
</style>
<h2 class="red-text">CatPhotoApp</h2>
<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 (X11; CrOS x86_64 9901.77.0) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/62.0.3202.97 Safari/537.36.

Link to the challenge:


#2

Your current code does not declare a “.red-text” class. Your code does declare an h2 selector which will make all of the h2 elements have red text color. In your h2 tag you have class=“red-text”, so you need to define that class as per the instructions up in style section, so it knows what red-text means.


#3

If I need to have a class declaring “red-text”, where do I type this? I have tried entering things like .red-text class=“red-text”>CatPhotoApp

.
Do I need to do this differently or what am I messing up?
Your help is highly appreciated.


#4

I checked out another person with this same problem and tried their code with one addition and it seemed to work. I do have a question about why one piece of code is needed then.

 h2 {
    color: red
  }
If that code is already written, why is this code here applicable?
  h2 .red-text  {
    color: red;
  }

Thanks for the support. Ill try and come back here if I have any more questions.


#5

I’ve edited your post for readability. When you enter a code block into the forum, remember to precede it with a line of three backticks and follow it with a line of three backticks to make easier to read. See this post to find the backtick on your keyboard. The “preformatted text” tool in the editor (</>) will also add backticks around text.

For this challenge you only needed to complete two instructions:

#1) Inside your style element, change the h2 selector to .red-text and update the color’s value from blue to red.
This is accomplished by:

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

#2) Give your h2 element the class attribute with a value of 'red-text’
This is accomplished by:

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