[css3-background] background-size: cover scaling

Posted in dotnet, vb, vb.net | No Comments »

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

--
Mark Nottingham     http://www.mnot.net/

Similar:

  1. [css3-background] Describing expansion of ‘background’ shorthand with commas This sentence (from 3.10) seems inaccurate: "Given a valid declaration, the shorthand first sets each of ?background-color?, ?background-position?, ?background-size?, ?background-repeat?, ?background-origin?, ?background-clip?, ?background-attachment? and ?background-image?...
  2. Css3 Transition on background transparent not working in Chrome 5 I`m trying to create an animation using CSS3 transition. The animation is a gradient background that should change his color (rgba). I used the webkit...
  3. CSS full page background scaling issues How can I make a full page background image and not have it stretched (something like this)? <html> <style> html, body {height:100%;} #background { min-height:100%;...
  4. Set Background Image on body1 Hi, I have set a background image to the bottom-right corner of the body1. To make it fixed there when scrolling up and down. For...
  5. CSS3 Gradients and border-radius leading to extraneous background in webkit Hello all, After my 1st question with relation to CSS3 gradients in which I was recreating an ‘inner glow’ I’ve now got to the point...

Leave a Reply