[CSS Backgrounds] root element

I am seeing something in both WebKit and Firefox (Minefield) nightlies  
that I can't find an explanation for in the current Editor's Draft of  
Backgrounds and Borders.

The 'Special Elements' section [1] talks about applying how the HTML  
root can take background properties from the BODY, which as we've all  
experienced for background-color. The implication is that the HTML  
root fills the viewport (perhaps some other spec even says that  
somewhere explicitly), since background-color does so when set on  
either BODY or HTML in html documents.

But I can't see why  a 'background-repeat:no-repeat', 'background- 
size: 100% 100%' background-image doesn't fill the viewport,  
regardless of when using 'BODY', 'HTML', or ':root' as a selector. It  
only fills the height of the body element.

If I use 'position:fixed', oddly, then it does use the viewport for  
sizing and positioning the image, but only when applied to the root or  
the HTML element, but not when applied to the BODY.

So am I missing something? Or is this a bug in both browsers? Or is  
further clarification needed about how BODY background properties get  
applied to the root?

Here is a test page I created, where you can size the inner window to  
be taller than about 370px:

http://www.bradclicks.com/cssplay/colortest.html

I can set the vertical size to something larger, like 20in, but I  
can't seem to get 100% vertical to mean 100% of the viewport. So I  
suppose that eventually I will be able to set the height to 1vh as a  
work-around


[1] http://dev.w3.org/csswg/css3-background/#special-backgrounds

Received on Thursday, 12 November 2009 01:13:42 UTC