Tell us what’s happening:
Your code so far
<style>
body {
background-color: black;
font-family: monospace;
color: pink;
}
pink-text: {
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_6) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/68.0.3440.106 Safari/537.36
.
Link to the challenge:
https://learn.freecodecamp.org/responsive-web-design/basic-css/prioritize-one-style-over-another/
hbar1st
August 29, 2018, 12:44am
#2
You are missing a single dot in front of this line
pink-text: {
i did that and still nothing
it looks like you changed the original color line
color: green;
put the green color back inside the body selector
or use the reset button to reset the code back to start and then add only the new pink-text selector and the new class attribute to h1
Your should have a pink-text CSS class that changes the color. This is the only question that has an X
make sure you have this
.pink-text {
color: pink;
}
Noticed that you have an extra colon as well in your original post, if you still have it, remove it.
ody {
background-color: black;
font-family: monospace;
color: pink;
}
pink-text: {
color: green;
}
Hello World!
Your h1 element should have the class pink-text.
Your should have a pink-text CSS class that changes the color.
Passed
Your h1 element should be pink.
your class selector still looks wrong.
take a look at my previous comment to see how it should look.
Thank you for your time . it still not working, i am not sure where i went wrong. smh
hbar1st
August 29, 2018, 1:44am
#11
ok just repost your latest code here but put it in between two lines with three backticks so I can see your formatting
```
put all the code here
```
body {
background-color: black;
font-family: monospace;
color: pink;
}
pink-test:{
color: pink;
}
</style>
<h1 class="pink-text">Hello World!</h1>
body {
background-color: black;
font-family: monospace;
color: pink;
}
pink-text:{
color: pink;
}
</style>
<h1 class="pink-text">Hello World!</h1>
hbar1st
August 29, 2018, 1:46am
#14
this part is still wrong.
You need to make it look exactly like the one I wrote previously.
That is, it should start with a dot and not have an extra colon in the selector name
body {
background-color: black;
font-family: monospace;
color: pink;
}
pink-text:{color: pink;}
</style>
<h1 class="pink-text">Hello World!</h1>
hbar1st
August 29, 2018, 2:01am
#16
dpinney39:
pink-text:{color: pink;}
I still don’t see that you changed anything.
Please just add a dot . in front of the line selecting pink-text and remove the extra colon character :
it should look exactly like this:
.pink-text {
color: pink;
}
1 Like
body {
background-color: black;
font-family: monospace;
color: pink;
}
.pink-text: {
color: pink;
}
</style>
<h1 class="pink-text">Hello World!</h1>
@hbar1st ’s answer works real fine. Remove the colon “:
” after the .pink-text
. That’s what’s breaking it.
hbar1st
August 29, 2018, 2:19am
#19
dpinney39:
.pink-text: {
still not correct because of the extra colon character
please remove it