Prioritize One Style Over Another - My h1 element should be pink

HTML-CSS
1

Tell us what’s happening:

My H1 element should be pink…

Your code so far


<style>
  body {
    background-color: black;
    font-family: monospace;
    color: green;
  }
   .pink-test {
    color: pink;
  }
</style>

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

Your browser information:

User Agent is: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_13_4) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/11.1 Safari/605.1.15.

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

2

Typo in your style class.

1 Like
3

Lol!!! Such a facepalm moment!

4

It’s incredibly common. There’s even tools available online that compare segments of code so you can copy/paste two different code blocks and it will highlight the differences for you. The longer and more complex code sections become, the more likely you will miss a bracket, semi-colon, or have a simple typo.

Many editing environments also come with automatic highlighting features, so if you have an element or word selected it will highlight all instances of that word, and you can quickly see a typo when something is not highlighted that should be.