background-086

Background with (color image repeat attachment)

WeasyPrint

This browser

Flags
image, interact
Assertion
Background with (color image repeat attachment) sets the background to the color specified, tiling the image across the x-axis and also scrolls with the content.

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 (color image repeat attachment)</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 (color image repeat attachment) sets the background to the color specified, tiling the image across the x-axis and also scrolls with the content.">
10         <style type="text/css">
11             #div1
12             {
13                 height: 200px;
14                 overflow: scroll;
15                 width: 200px;
16             }
17             div div
18             {
19                 background: green url("support/cat.png") repeat-x scroll;
20                 height: 400px;
21                 width: 400px;
22             }
23         </style>
24     </head>
25     <body>
26     <p>Test passes if there is a picture of a cat repeated over a green box the box below. The cat image also needs to move with the scrolling mechanism when scrolled to the right.</p>
27         <div id="div1">
28             <div></div>
29         </div>
30     </body>
31 </html>