Page 1 of 1

CSS help please

Posted: Sat Jul 28, 2012 8:23 pm
by Live24x7
Amongst other I have two blocks :

[text]body {background:#red;}
#container {background:#fff; width:1100px;}[/text]

The problem is #container background fails to turn #fff and inherits #red from the body element.

Any explanations why this is happening ?

Please help - i have wasted one hour on this trivial issue and fail to understand why this is happening :(

Re: CSS help please

Posted: Sun Jul 29, 2012 10:10 am
by social_experiment
What does the html look like and does it occur in all browsers?

Re: CSS help please

Posted: Sun Jul 29, 2012 10:24 am
by Live24x7
thanks for replying - yes it occurs in all browsers

Re: CSS help please

Posted: Sun Jul 29, 2012 10:35 am
by Live24x7
And here is the html structure
<html><head>
</head>
<body>
<div id="container">
<div id="content">
<div id="post">
</div><!--eof post-->
<div id="sidebar"> </div><!--eof sidebar-->
</div><!--eof content-->
</div><!--eof container-->

</body></html>


Re: CSS help please

Posted: Sun Jul 29, 2012 3:48 pm
by social_experiment

Code: Select all

body {background-color : red;}
#container {background-color :#fff; width:1100px;}
I added -color behind background declaration and removed the # in front of red. For color keywords such as red, cyan, magenta, etc you can leave the hash away.

Re: CSS help please

Posted: Sun Jul 29, 2012 4:39 pm
by Live24x7
thanks buddy -

but that still does not solve the problem for me.
Did you check this at your end ?
and the red thing here is just for the example the actual color is #252525 - not that it should matter anyways.
The body background-color still overpowers the #container background-color.

:(

Re: CSS help please

Posted: Sun Jul 29, 2012 4:43 pm
by Live24x7
tomorrow i have client to answer and this would me the most ridiculous thing i would have ever said - that i cannot change the background color and the container color- yike :(

Re: CSS help please

Posted: Mon Jul 30, 2012 1:28 am
by social_experiment
Live24x7 wrote:Did you check this at your end ?
Yip :)

Code: Select all

<html><head>
<style >
body {background-color : red;}
#container {background-color :#fff; width:1100px;}
</style>
</head>
<body>
<div id="container">
 Blob.
<div id="content">
<div id="post">
</div><!--eof post-->
<div id="sidebar"> </div><!--eof sidebar-->
</div><!--eof content-->
</div><!--eof container-->

</body></html>