- From: L. David Baron <dbaron@dbaron.org>
- Date: Sat, 18 Sep 2010 08:43:43 -0700
- To: Mark Nottingham <mnot@mnot.net>
- Cc: www-style@w3.org
On Saturday 2010-09-18 20:24 +1000, Mark Nottingham wrote: > I've noticed that in two implementations*, at least, background-size: cover doesn't appear to operate as one would expect. > > My case: > http://www.mnot.net/ > ... where a background image is attached to the body and sized to 'cover'. > > Here, the image appears to cover well and scale appropriately with "normal" browser window sizes, but when one sizes the window to be reasonably narrow yet tall, a white bar appears at the bottom; i.e., it does not truly cover the box. > > Is this working as specified, or are there bugs in the implementations? > > Kind regards, > > * Firefox, as well as Safari and Chrome; all most recent releases I think this is working as specified. In particular, see the entirety of section 3.11 (The backgrounds of special elements): http://www.w3.org/TR/css3-background/#special-backgrounds , which says in the first paragraph that the background of the root element is displayed on the canvas, but sized and positioned as for the root element, and which says in the second paragraph that the background of body is propagated to the root in some cases. I think your problem could probably be solved with something like: html { min-height: 100% } body { margin: 0; padding: /* replace any margin value you cared about */ } -David -- L. David Baron http://dbaron.org/ Mozilla Corporation http://www.mozilla.com/
Received on Saturday, 18 September 2010 15:44:14 UTC