Forcing child divs to use parent's style

But, as i see, chid divs' style overwrite parent's style even though child's did not have that property.

No, they just don't inherit the value by default, so they get whatever value they would otherwise have (which is usually transparent).

You can (in theory) get what you want with background-color: inherit. That has problems in older versions of IE though.


Use css selectors like this to make the background of child div's inherit from their parent:

Parent's div
<div id="thisparticulardiv">
some codes here...
child's div
<div class="childrendiv">
again some codes...
</div></div>

CSS:

#thisparticulardiv {
    background-color:#ADADAD;
    ...
}

#thisparticulardiv div {
    background: inherit;
    position:absolute;
    font-size:12px;
    left:600px;
    top:100px;
}

Use the inherit property on the child div :

background:inherit

<div style="position:absolute;font-size:12px; left:600px;top:100px; background:inherit">

Tags:

Html

Css