What's wrong with this?

Tell us what’s happening:

Your code so far


<style>
  body {
    background-color: black;
    font-family: monospace;
    color: green;

    .pink-text{
      color: pink;
    }

  
  }
</style>
<h1 class="pink-text">Hello World!</h1>

Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 6.1; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/69.0.3497.92 Safari/537.36.

Link to the challenge:
https://learn.freecodecamp.org/responsive-web-design/basic-css/prioritize-one-style-over-another

<style>
  .pink-text{
    color: pink;
  }
  body {
    background-color: black;
    font-family: monospace;
    color: green;
  }
</style>
<h1 class="pink-text">Hello World!</h1>

you have a syntax error, you have declared your pink-style inside your body-style curly brackets. don’t declare the .pink-style inside the body style definition. it wont work.

1 Like

You have your .pink-text inside of your body element.

It should go like this

body {
  /* css */
}
.pink-text{
  /* css */
}

pink text is inside of your body element in html, but in CSS they are two separate items.

Thank you. I didn’t notice that the pink color was inside the body element.

(please hit the reply button or i do not get any notification)