CODEWITHSUNDEEP
htmlcss
susanz
susanz

Reputation: 159

overwrite inherited value from parent

I feel like this is a very silly question. I am trying to have a child element to have a different style from its parent. As in this JSFIDDLE example. The id logo should have an orange color. However, it's currently in black because of the style for a. How to overwrite the color and change it to orange?

Thank you

html:

<p id="logo"><a href="#">LOGO</a></p>

css:

a {
text-decoration: none;
color: rgba(0,0,0,1.00);
}

#logo{
font-family: "Century Gothic";
font-weight: bold;
font-size:2.3em;
color: #FF9D00;
}

Upvotes: 0

Views: 80

Answers (1)

user1721650
user1721650

Reputation:

Either set it more explicitly with #logo a, or set the color for the logo as !important which will prevent it from being overridden from a higher priority:

color: #FF9D00 !important;

OR 

#logo a {
  color: #FF9D00;
}

Upvotes: 1

Related Questions