blob: 821c1c5445f1da1420398769381eae09493f4e08 (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
|
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>
CSS Test: 'Background-attachment' with value 'local'
</title>
<link rel="author" title="Melanie Archer" href="mailto:job@twobanjos.com" />
<link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-attachment" />
<meta name="flags" content="interact" />
<meta name="assert" content="If 'background-attachment' is given the value 'local,' then the background image scrolls with the containing element's content when the element's content is scrolled" />
<style type="text/css">
#test-container {
background-attachment: local;
background-image: url("support/cat.png");
background-repeat: no-repeat;
border: 1px solid blue;
height: 250px;
overflow: scroll;
padding: 100px 0 0;
width: 250px;
}
</style>
</head>
<body>
<p>
Test passes if the image of the cat scrolls out of view when the blue-bordered containing block is scrolled.
</p>
<div id="test-container">
Cupcake ipsum dolor sit. Amet applicake bonbon chocolate cake ice cream. Bear claw tootsie roll cotton candy biscuit. Sweet roll chupa chups gingerbread sugar plum icing muffin biscuit. Chocolate cake wafer pastry tart macaroon danish topping ice cream. Jujubes liquorice candy canes faworki. Jujubes cake caramels faworki pie cake sweet roll. Tiramisu sesame snaps candy cheesecake brownie souffle biscuit. Danish chupa chups donut. Donut tart marshmallow biscuit lollipop chupa chups jelly beans faworki. Sugar plum wafer faworki marshmallow brownie ice cream cotton candy marshmallow marzipan. Cheesecake gummi bears cupcake sweet croissant cookie chocolate bar sweet roll. Halvah cupcake carrot cake souffle carrot cake chocolate cake pastry gummi bears muffin. Sweet roll candy gingerbread dessert tart. Pastry oat cake jelly beans.
</div>
</body>
</html>
|