Problem Explanation
You can override all other styles in CSS by using !important
.
This override is considered the most important and takes precedence over the rest.
The list of most important to least important is as follows:
important (!important)
inline styles
id declarations
class declarations
Here is an example of how to write/apply !important:
color: black !important;
To apply these in context and see !important
take precedence, here is an example:
<style>
body {
font-family: Helvetica;
color: purple;
}
#violet-text {
color: violet;
}
.black-text {
color: black !important;
}
.blue-text {
color: blue;
}
</style>
<h1 id="violet-text" class="black-text blue-text" style="color: black">Example Text</h1>
This result would end in Example Text
being black because of !important
added to color: black
.
5 Likes
Hello
I have been working on this challenge (challenge 58) and it is saying that i have not done a step when i believe that i have
it is saying that i have not put in the !important after pink in pink-text
plz help
body {
background-color: black;
font-family: Monospace;
color: green;
}
#orange-text {
color: orange;
}
.pink-text {
color : pink !important;
}
.blue-text {
color: blue;
}
Hello World!
5 Likes
rique
July 7, 2017, 2:01am
3
i just put that in for mine & it works.
2 Likes
same problem any suggestions
That appears to be correct. Since we are modifying the class statement I would look at the class call in the h1 brackets for the error.
I have the same problem… with only some people having the problem I think its a spelling error. This program is very sensitive.
1 Like
I GOT IT!!! DO A LOWER CASE “I” Example: !important NOT !Important
Vinny
July 20, 2017, 11:27am
8
Had the same problem. Do a small cap for “!important” and make sure there is no space between “!important” and the semi-colon. That should give you the swoosh
1 Like
**Just write it as it appears in the instruction, no space no Cap and it should be in the same line ! ** color:pink !important;
1 Like