Welcome to the Treehouse Community
Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.
Looking to learn something new?
Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.
Start your free trialEnemuo Felix
1,895 PointsThe Inherit value
I have been curious about what the Inherit value really does in CSS. I have come to notice that it is also accepted by all css properties. Can someone please explain it for me? I will also appreciate if With code pen or any other online editor if. Thanks
-Noob
Eusebiu Gagea
14,127 Pointsdiv { color: #666; } div p { color: blue; text-decoration: underline; } div p.inactive { color: inherit; text-decoration: none; } <div> <p></p> <p class="inactive"></p> <p></p> </div> That's the example I talked about.
Enemuo Felix
1,895 PointsEusebiu Gagea
CSS
div {
color: #666;
}
div p {
color: blue;
text-decoration: underline;
}
div p.inactive {
color: inherit;
text-decoration: none;
}
HTML
<div> <p></p> <p class="inactive"></p> <p></p> </div>
According to your explanation, the color value for the div p.inactive will be the same as the parent element. Which is #666? So what happens if you repeat the same color value(#666) instead of giving it the 'Inherit' value?
Eusebiu Gagea
14,127 PointsIt's the same thing. But you'll see that css is all about pattern and is good to know that this color is inherited from the parent.
Enemuo Felix
1,895 PointsThanks so much Eusebiu Gagea Perhaps, you could change to answer instead of comment so that i can mark you
Eusebiu Gagea
14,127 PointsHappy to help you! Whenever you have more questions just let me know.
1 Answer
Eusebiu Gagea
14,127 PointsWhat it does is assigning the value with the parent property value. On my experiences there aren't so many cases when you should use it. A child takes by default its parent property value, and in this way you can override some properties. For example, say you have a div with p tags inside it and you set some properties for that p tags. Now, some p tags need to have let's say the same color value as the div, and now you use inherit. In my opinion this is the best practice for it. Let me know if you understood what I tried to explain here and please come back with more questions if not. + I've recently found that not all the properties are inherited by default.
Eusebiu Gagea
14,127 PointsEusebiu Gagea
14,127 PointsWhat it does is assigning the value with the parent property value. On my experiences there aren't so many cases when you should use it. A child takes by default its parent property value, and in this way you can override some properties. For example, say you have a div with p tags inside it and you set some properties for that p tags. Now, some p tags need to have let's say the same color value as the div, and now you use inherit. In my opinion this is the best practice for it. Let me know if you understood what I tried to explain here and please come back with more questions if not. + I've recently found that not all the properties are inherited by default.