layout/reftests/border-image/border-image-linear-gradient-repeat-repeat-1-ref.html

Fri, 16 Jan 2015 18:13:44 +0100

author
Michael Schloh von Bennewitz <michael@schloh.com>
date
Fri, 16 Jan 2015 18:13:44 +0100
branch
TOR_BUG_9701
changeset 14
925c144e1f1f
permissions
-rw-r--r--

Integrate suggestion from review to improve consistency with existing code.

     1 <!DOCTYPE html>
     2 <html lang="en-US">
     3 <head>
     4 <title>test of border-image-source: linear-gradient with border-image-slice</title>
     5 <style>
     6 table { margin: 0; padding: 0; border-spacing: 0; empty-cells: show; }
     7 td { padding: 0; }
     8 </style>
     9 </head>
    10 <body>
    11 <table>
    12   <col style="width: 30px">
    13   <col style="width: 180px">
    14   <col style="width: 30px">
    15   <tr style="height: 30px">
    16     <td style="background-image: linear-gradient(to bottom right, red, blue); background-size:30px 30px;"></td>
    17     <td></td>
    18     <td style="background-image: linear-gradient(to bottom right, red, blue); background-size:30px 30px;"></td>
    19   </tr>
    20   <tr style="height: 180px">
    21     <td></td>
    22     <td style="background: white"></td>
    23     <td></td>
    24   </tr>
    25   <tr style="height: 30px">
    26     <td style="background-image: linear-gradient(to bottom right, red, blue); background-size:30px 30px;"></td>
    27     <td></td>
    28     <td style="background-image: linear-gradient(to bottom right, red, blue); background-size:30px 30px;"></td>
    29   </tr>
    30 </table>
    31 <table>
    32 <col style="width: 30.0px;">
    33 <col style="width: 180.0px;">
    34 <col style="width: 30.0px;">
    35 <tr style="height: 30.0px;">
    36   <td style="background-image: linear-gradient(to bottom right, red, blue); background-size: 600.0px 600.0px; background-position: 0px 0px;"></td>
    37   <td style="background-image: linear-gradient(to bottom right, red, blue); background-size: 600.0px 600.0px; background-position: -210.0px -0.0px;"></td>
    38   <td style="background-image: linear-gradient(to bottom right, red, blue); background-size: 600.0px 600.0px; background-position: -570.0px 0px;"></td>
    39 </tr>
    40 <tr style="height: 180.0px;">
    41   <td style="background-image: linear-gradient(to bottom right, red, blue); background-size: 600.0px 600.0px; background-position: -0.0px -210.0px;"></td>
    42   <td style="background-image: white;"></td>
    43   <td style="background-image: linear-gradient(to bottom right, red, blue); background-size: 600.0px 600.0px; background-position: -570.0px -210.0px;"></td>
    44 </tr>
    45 <tr style="height: 30.0px;">
    46   <td style="background-image: linear-gradient(to bottom right, red, blue); background-size: 600.0px 600.0px; background-position: 0px -570.0px;"></td>
    47   <td style="background-image: linear-gradient(to bottom right, red, blue); background-size: 600.0px 600.0px; background-position: -210.0px -570.0px;"></td>
    48   <td style="background-image: linear-gradient(to bottom right, red, blue); background-size: 600.0px 600.0px; background-position: -570.0px -570.0px;"></td>
    49 </tr>
    50 </table>
    51 <table>
    52   <col style="width: 30px">
    53   <col style="width: 180px">
    54   <col style="width: 30px">
    55   <tr style="height: 30px">
    56     <td style="background-image: linear-gradient(to bottom right, red, blue); background-size:240px 240px; background-position: 0px 0px;"></td>
    57     <td style="background-image: linear-gradient(to bottom right, red, blue); background-size:240px 240px; background-position: -30px 0px;"></td>
    58     <td style="background-image: linear-gradient(to bottom right, red, blue); background-size:240px 240px; background-position: -210px 0px;"></td>
    59   </tr>
    60   <tr style="height: 180px">
    61     <td style="background-image: linear-gradient(to bottom right, red, blue); background-size:240px 240px; background-position: 0px -30px;"></td>
    62     <td style="background: white"></td>
    63     <td style="background-image: linear-gradient(to bottom right, red, blue); background-size:240px 240px; background-position: -210px -30px;"></td>
    64   </tr>
    65   <tr style="height: 30px">
    66     <td style="background-image: linear-gradient(to bottom right, red, blue); background-size:240px 240px; background-position: 0px -210px;"></td>
    67     <td style="background-image: linear-gradient(to bottom right, red, blue); background-size:240px 240px; background-position: -30px -210px;"></td>
    68     <td style="background-image: linear-gradient(to bottom right, red, blue); background-size:240px 240px; background-position: -210px -210px;"></td>
    69   </tr>
    70 </table>
    71 </body>
    72 </html>

mercurial