background-attachment-local-scrolling

Scrolling when 'background-attachment: local'

WeasyPrint

This browser

Assertion
If 'background-attachment: local' the background scrolls along with the element's contents (the UA may treat 'background-clip: border-box' as the same as 'background-clip: padding-box').

Source

 1 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
 2 <html xmlns="http://www.w3.org/1999/xhtml"><head>
 3         <title>CSS Test: Scrolling when 'background-attachment: local'</title>
 4         <link href="http://www.microsoft.com/" rel="author" title="Microsoft">
 5         <link href="http://www.w3.org/TR/css3-background/#the-background-attachment" rel="help">
 6         <meta content="" name="flags">
 7         <meta content="If 'background-attachment: local' the background scrolls along with the element's contents (the UA may treat 'background-clip: border-box' as the same as 'background-clip: padding-box')." name="assert">
 8         <style type="text/css">
 9             div
10             {
11                 width: 2in;
12                 height: 2in;
13                 border: 50px double black;
14                 background-image: url("../support/cat.png");
15                 background-attachment: local;
16                 overflow: scroll;
17             }
18         </style>
19     </head>
20     <body>
21         <p>Test passes if the images of all the cats scroll when the box is scrolled. (Presence of cats behind the double border is UA dependent). </p>
22         <div>Filler Text Filler Text
23         Filler Text Filler Text Filler Text
24         Filler Text Filler Text Filler Text
25         Filler Text Filler Text Filler Text
26         Filler Text Filler Text Filler Text
27         Filler Text Filler Text Filler Text
28         Filler Text Filler Text Filler Text
29         Filler Text Filler Text Filler Text
30         Filler Text Filler Text Filler Text
31         Filler Text Filler Text Filler Text
32         Filler Text Filler Text Filler Text
33         Filler Text Filler Text Filler Text
34         Filler Text Filler Text Filler Text
35         Filler Text Filler Text </div>
36     
37 
38 </body></html>