0

I recently posted a question about CSS inheritance for the property color (Immediate children css, and only those).

This CSS

.parent > div {
  color: green;
  display: inline-block;
}

on this HTML:

<div class="parent">
  <div>First child
    <div>Second child</div>
  </div>
</div>

would result in: http://jsfiddle.net/nhko3wyr/

I do understand that color and display properties differs in how they cascade and affect the DOM, and since this is a fact - is there a list with ALL properties divided into "inheriting" and "not inheriting" properties?

Community
  • 1
  • 1
kortes
  • 33
  • 1
  • 9
  • I currently don't know a full list. But the default value of `color` for most elements (except e.g. `a`) is `inherit` thats why the child element has the same color as its parent. – t.niese Feb 01 '15 at 21:01
  • Take a look at this a little outdated list : http://www.w3.org/TR/css-2010/#indices –  Feb 01 '15 at 21:04
  • @user3790069 thanks for the share. It was something like this I was looking for. – kortes Feb 01 '15 at 21:06
  • "I'm marking the question as answered" U can't, I didn't write any answers :P –  Feb 01 '15 at 21:07
  • As you mention `display` if you take a look at [Box-sizing: Border-box](http://www.paulirish.com/2012/box-sizing-border-box-ftw/) you can apply `inherit` yourself for certain elements. Using that technique you could also make `display` to be `inherit`: [slightly changed fiddle](http://jsfiddle.net/nhko3wyr/1/) – t.niese Feb 01 '15 at 21:07
  • @user3790069 I'm tired, ok? :) – kortes Feb 01 '15 at 21:08
  • @t.niese thank you for sharing this insight. I would like to know if it's possible to say .parent { font-size:0; } without affecting the font-size of what's inside .parent (in the HTML)? (I know you can do: .parent * { font-size: 12px; } but that's a "reset" which I don't wanna do) – kortes Feb 01 '15 at 21:11
  • Just a little note: the way you asked the question theoretically is off topic as `[...]Questions asking us to recommend or find a book, tool, software library, tutorial or other off-site resource are off-topic.` But thats IMHO nitpicking as a simple change to `I already searched a list but a didn't find one. How can I detect if an element is inheriting?` or `Why is color inheriting but display not?` would solve that problem. Anyway I suggest to take care about in future questions. – t.niese Feb 01 '15 at 21:19
  • I would create a new question, but problem is I can only post 1 post per 90 minutes. What I'm trying to do is to break down the problem part by part to, perhaps, find a nice solution to my problem. I'm sorry if I'm using stack overflow wrong.. – kortes Feb 01 '15 at 21:28
  • There is solid definition of what CSS properties there are, and the situation keeps changing. Each CSS specification or draft indicates, for each property, whether the property is inherited or not. It is thus just one small part of learning a CSS property to know the answer for it. Thus, a full list would be both unnecessary and impossible to produce. But many CSS specifications have a summary table of properties, with inheritability indicated in one column. – Jukka K. Korpela Feb 01 '15 at 21:48
  • Here's the [real deal](http://stackoverflow.com/questions/28282839/building-a-grid-framework-with-inline-blocks/) – kortes Feb 02 '15 at 17:12

0 Answers0