background-046

Background with (image attachment position)

WeasyPrint

This browser

Flags
image, interact
Assertion
Background with (image attachment position) sets the background to the image specified, the image is positioned at the bottom, and scrolls with the box.

Source

 1 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
 2 <html>
 3     <head>
 4         <title>CSS Test: Background with (image attachment position)</title>
 5         <link rel="author" title="Microsoft" href="http://www.microsoft.com/">
 6         <link rel="help" href="http://www.w3.org/TR/CSS21/colors.html#propdef-background">
 7         <link rel="help" href="http://www.w3.org/TR/CSS21/colors.html#background-properties">
 8         <meta name="flags" content="image interact">
 9         <meta name="assert" content="Background with (image attachment position) sets the background to the image specified, the image is positioned at the bottom, and scrolls with the box.">
10         <style type="text/css">
11             #div1
12             {
13                 height: 200px;
14                 width: 200px;
15                 overflow: scroll;
16             }
17             div div
18             {
19                 background: url("support/cat.png") scroll bottom left;
20                 width: 400px;
21                 height: 400px;
22             }
23         </style>
24     </head>
25     <body>
26         <p>Test passes if the box below is filled with cat images, and when the box is scrolled down, the cat images move. Also, the cat in the left bottom corner is not cut off.</p>
27         <div id="div1">
28             <div></div>
29         </div>
30     </body>
31 </html>