my inner divs dont inherit the parent background colour

mike224 · Jun 18, 2011

I'm not sure why, but my inner divs arent inheriting the background colour of my wrapper divs

The basic design of the site is
Code:

<body>
<div class="centerbody"> // my wrapper div
/// rest of site
</div>
</body>

I have css for the body and for the wrapper:

Code:

body {
background:none repeat scroll 0 0 #EFEFEF;
font-family:Verdana,Arial,Sans-Serif;
font-size:13px;line-height:1.4;
}

Code:

.centerbody {
background:none repeat scroll 0 0 #BFBFBF;
width: 1000px;
border: 0px none; margin-left: auto; margin-right: auto;
}

I've also tried using an id of centerbody, and defining #centerbody in the css, this didnt work

I've also tried using background-color: #BFBFBF; (for centerbody) and this didnt work

I just cant figure out why the child divs are only inheriting the body background, but not the parent div centerbody background, any ideas?
- and if I delete the body class, the child divs dont inherit any background colour at all

(example here: http:\\

http://www.rightsfortenants.co.uk)

vacunita · Jun 18, 2011

1. Your centerbody has an ID, and your style is a class.
2. Background Inheritance is not automatic, you need to actually specify it. background-color's default value is transparent. If you want to get it to inherit, use the inherit value.

Code:

.bodywrapsize{
background-color:inherit;
}

3. Your div bodywrapsize doesn't actually wrap around its contents
so no background would be seen. You can test this by giving bodywrapsize a border, you'll see it will appear as a line on top of its contents.
To fix this give your bodywrapsize div an overflow:auto or hidden.

4. The child divs are not inheriting anything, they are simply transparent as per the default value of background-color

----------------------------------
Phil AKA Vacunita
----------------------------------
Ignorance is not necessarily Bliss, case in point:
Unknown has caused an Unknown Error on Unknown and must be shutdown to prevent damage to Unknown.

Behind the Web, Tips and Tricks for Web Development.

http://behindtheweb.blogspot.com/

Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

my inner divs dont inherit the parent background colour

mike224

Programmer

vacunita

Programmer

Similar threads

Part and Inventory Search

Sponsor