How to inherit from ancestor and not parent in CSS?

Viewed 579

Here is my code:

.ancestor { 
    background-color: #ccc;
}

.parent { 
    background-color: #fff;
}

.child {
    /* ??? */
}

How can I have .child inherit background-color: #ccc; without changing the class declaration order?

I tried background-color: inherit; but all I got is a complete reset (ie no color) of the background-color property.

Please also note I can't change neither .ancestor nor .parent.

2 Answers
Related