<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN">
<html lang="en">
 <head>
  <title>Scrolling Backgrounds with Background Attachment Local</title>
  <style type="text/css">
   div {
     background: -30px -30px silver url(resources/smallcats.gif) local;
     border: 30px dotted;
     overflow: auto; height: 138px; width: 330px;
     white-space: pre; font-size: 16px;
   }
   ul { color: navy; }
  </style>
 </head>
 <body>

  <ul>
   <li>You should not see the background under the border.</li>
   <li>As you scroll the element below the cats should move.</li>
   <li>The cats should be on a light grey background.</li>
  </ul>

  <div>   1
   2
   3
   4
   5
   6
   7
   8
   9
  10
  11
  12
  13
  14
  15
  16
  17
  18
  19
  20  </div>
 </body>
</html>