background-size-body-percent-percent-overflow.html (797B)
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <title>background-size: 100% 100%; on body</title> 5 <style type="text/css"> 6 body 7 { 8 background-image: url(green-8x20-blue-8x20-vertical.png); 9 background-repeat: no-repeat; 10 background-attachment: fixed; 11 overflow: hidden; 12 13 /* 14 * This should not affect how the background paints, that is, how the 15 * background image is sized: 16 * 17 * If the ‘background-attachment’ value for this image is ‘fixed’ [...] the 18 * background positioning area is the initial containing block [CSS21]. 19 * 20 * Thus '100% 100%' below is relative to the viewport size, so we expect to 21 * see a background which, modulo aliasing, is half green and half blue. 22 */ 23 height: 10000px; 24 25 background-size: 100% 100%; 26 } 27 </style> 28 </head> 29 <body> 30 </body> 31 </html>