layout/reftests/backgrounds/background-size-zoom-repeat-ref.html

Wed, 31 Dec 2014 07:16:47 +0100

author
Michael Schloh von Bennewitz <michael@schloh.com>
date
Wed, 31 Dec 2014 07:16:47 +0100
branch
TOR_BUG_9701
changeset 3
141e0f1194b1
permissions
-rw-r--r--

Revert simplistic fix pending revisit of Mozilla integration attempt.

     1 <!DOCTYPE html>
     2 <html>
     3 <head>
     4   <title>background-size: 64px 40px; repeat, zoom reference</title>
     5   <style type="text/css">
     6 html
     7 {
     8   margin: 0;
     9   padding: 0;
    10 }
    11 body
    12 {
    13   margin: 0;
    14   padding: 20px;
    15 }
    16 #outer
    17 {
    18   width: 512px;
    19   height: 320px;
    20 }
    21   /*
    22    * PRE-ZOOM:
    23    *   2x size the image, then tile it 4x4 across the div; sampling artifacts at
    24    *   32px horizontal offset, then every 64px for the full height of the div.
    25    * POST-ZOOM:
    26    *   4x size the image, then tile it 4x4 across the div; sampling artifacts at
    27    *   64px horizontal offset, then every 128px for the full height of the div.
    28    */
    30 /* Aargh, sampling artifacts, we hates them, precioussss. */
    31 #outer > div
    32 {
    33   display: inline-block;
    34   width: 56px;
    35   height: 320px;
    36 }
    37 .blue
    38 {
    39   background: url(blue-16x20.png);
    40   border-right: 8px solid black;
    41 }
    42 .green
    43 {
    44   background: url(green-16x20.png);
    45   border-left: 8px solid black;
    46 }
    47   </style>
    48 </head>
    49 <body>
    50 <div id="outer"><div
    51   class="blue"></div><div
    52   class="green"></div><div
    53   class="blue"></div><div
    54   class="green"></div><div
    55   class="blue"></div><div
    56   class="green"></div><div
    57   class="blue"></div><div
    58   class="green"></div></div>
    59 </body>
    60 </html>

mercurial