blob: 4c6db134014b2f33821adec1b7bd7b8e96d331c6 (
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 'fixed'
</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 'fixed,' then the background image remains fixed in relation to the user agent viewport when the viewport is scrolled." />
<style type="text/css">
#test-container {
background-attachment: fixed;
background-position: 1em 5em;
background-image: url("support/cat.png");
background-repeat: no-repeat;
border: 1px solid blue;
height: 250px;
overflow: scroll;
width: 250px;
}
</style>
</head>
<body>
<p>
Test passes if the cat image does not move when the blue-bordered containing block or the viewport 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>
|
