Log in

View Full Version : Why isn't my background black?


Johnnymushio
03-24-2011, 01:12 AM
I was trying to make a black background, with a white wrapper.

http://japantown.awardspace.com/divdesign.shtml
djr33
03-24-2011, 01:20 AM
I think it is black, but you just can't see it because the other colors are covering it up. You can specify a height (for example 100%) to make it fill the whole screen. Or as you add content it will automatically expand.

You can also change the body margins to remove the white edges if you'd like.
Johnnymushio
03-24-2011, 02:11 AM
i thought by specifying in the body for a black background color, it would make everything that is white on my page now, black.

how would i do that then?
traq
03-24-2011, 04:11 AM
that's actually kinda odd.

I think Daniel's right about the <body> "shrinking" -or more accurately, "not expanding"- around the content (0 margin or 100% height/width won't make it cover the page because the root (html) element doesn't have a set width).

In all cases, html{ background: black; } should solve things. In Firefox, simply setting the html{} selector (with no rules) will trigger the black background.

As I said, odd. I think this has something to do with how the Initial Containing Block and/or the Canvas inherit properties (they inherit certain properties "backwards," more or less). It's an interesting subject, but I haven't got my head quite around it yet.
Johnnymushio
03-24-2011, 11:42 AM
ok that worked, but is there any reason why the corners are not rounded off?

EDIT

hm, nevermind. when i set the html background to black, it worked. but i also had to set the body background to black or else everything turned white.

the corners were rounded, but i had to get rid of the background colors for each of the three divs.
djr33
03-24-2011, 04:19 PM
Thanks for adding that, traq. Using the html element's CSS is definitely the right answer, since body can't be easily set to 100% in case it might be more than 100% if it's a tall page.