layout/reftests/table-background/border-separate-opacity-table-column-group-ref.html@7e26c7da4463 (annotated)
layout/reftests/table-background/border-separate-opacity-table-column-group-ref.html
Wed, 31 Dec 2014 06:55:50 +0100
- author
- Michael Schloh von Bennewitz <michael@schloh.com>
- date
- Wed, 31 Dec 2014 06:55:50 +0100
- changeset 2
- 7e26c7da4463
- permissions
- -rw-r--r--
Added tag UPSTREAM_283F7C6 for changeset ca08bd8f51b2
| michael@0 | 1 | <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" |
| michael@0 | 2 | "http://www.w3.org/TR/html4/strict.dtd"> |
| michael@0 | 3 | <html lang="en-US"> |
| michael@0 | 4 | <head> |
| michael@0 | 5 | <title>Table background tests</title> |
| michael@0 | 6 | <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> |
| michael@0 | 7 | <meta http-equiv="Content-Style-Type" content="text/css"> |
| michael@0 | 8 | <style type="text/css"> |
| michael@0 | 9 | |
| michael@0 | 10 | html, body { margin: 0; padding: 0; border: 0; font-size: 16px; } |
| michael@0 | 11 | body { padding: 15px; } |
| michael@0 | 12 | |
| michael@0 | 13 | .o { opacity: 0.5; } |
| michael@0 | 14 | |
| michael@0 | 15 | /* |
| michael@0 | 16 | table { |
| michael@0 | 17 | margin: 0px 3px 2px 4px; |
| michael@0 | 18 | border-width: 4px 2px 7px 3px; |
| michael@0 | 19 | |
| michael@0 | 20 | border-box height is 145px: |
| michael@0 | 21 | border-top: 4px; |
| michael@0 | 22 | padding-top: 3px |
| michael@0 | 23 | border-spacing: 3px * 6 == 18px |
| michael@0 | 24 | cell * 5: == 21px * 5 == 105px |
| michael@0 | 25 | border-top: 2px; |
| michael@0 | 26 | padding-top: 1px; |
| michael@0 | 27 | height: 10px; |
| michael@0 | 28 | padding-bottom: 4px; |
| michael@0 | 29 | border-bottom: 4px; |
| michael@0 | 30 | padding-bottom: 8px; |
| michael@0 | 31 | border-bottom: 7px; |
| michael@0 | 32 | |
| michael@0 | 33 | border-box width is 325px: |
| michael@0 | 34 | border-left: 3px; |
| michael@0 | 35 | padding-left: 6px |
| michael@0 | 36 | border-spacing: 2px * 6 == 12px |
| michael@0 | 37 | cell * 5: == 59px * 5 == 295px |
| michael@0 | 38 | border-left: 3px; |
| michael@0 | 39 | padding-left: 3px; |
| michael@0 | 40 | width: 50px; |
| michael@0 | 41 | padding-right: 2px; |
| michael@0 | 42 | border-right: 1px; |
| michael@0 | 43 | padding-right: 7px; |
| michael@0 | 44 | border-right: 2px; |
| michael@0 | 45 | */ |
| michael@0 | 46 | |
| michael@0 | 47 | div.color, div.imagetl, div.imagebr { |
| michael@0 | 48 | width: 181px; height: 117px; margin: 10px 75px 30px 76px; |
| michael@0 | 49 | } |
| michael@0 | 50 | div.color { background-color: aqua; } |
| michael@0 | 51 | |
| michael@0 | 52 | div.imagetl, div.imagebr { |
| michael@0 | 53 | background-image: url(repeatable-diagonal-gradient-with-ticks.png); |
| michael@0 | 54 | } |
| michael@0 | 55 | |
| michael@0 | 56 | div.imagetl { background-position: 0 0; } |
| michael@0 | 57 | div.imagebr { background-position: 181px 117px; } |
| michael@0 | 58 | |
| michael@0 | 59 | div.vstripe, div.hstripe { background: white; position: absolute; } |
| michael@0 | 60 | div.vstripe { top: 0; width: 2px; height: 500px; } |
| michael@0 | 61 | div.hstripe { left: 0; height: 3px; width: 400px; } |
| michael@0 | 62 | |
| michael@0 | 63 | </style> |
| michael@0 | 64 | </head> |
| michael@0 | 65 | <body> |
| michael@0 | 66 | |
| michael@0 | 67 | <div class="color"></div> |
| michael@0 | 68 | <div class="imagetl o"></div> |
| michael@0 | 69 | <div class="imagebr o"></div> |
| michael@0 | 70 | |
| michael@0 | 71 | <div class="hstripe" style="top: 46px"></div> |
| michael@0 | 72 | <div class="hstripe" style="top: 70px"></div> |
| michael@0 | 73 | <div class="hstripe" style="top: 94px"></div> |
| michael@0 | 74 | <div class="hstripe" style="top: 118px"></div> |
| michael@0 | 75 | <div class="hstripe" style="top: 193px"></div> |
| michael@0 | 76 | <div class="hstripe" style="top: 217px"></div> |
| michael@0 | 77 | <div class="hstripe" style="top: 241px"></div> |
| michael@0 | 78 | <div class="hstripe" style="top: 265px"></div> |
| michael@0 | 79 | <div class="hstripe" style="top: 340px"></div> |
| michael@0 | 80 | <div class="hstripe" style="top: 364px"></div> |
| michael@0 | 81 | <div class="hstripe" style="top: 388px"></div> |
| michael@0 | 82 | <div class="hstripe" style="top: 412px"></div> |
| michael@0 | 83 | |
| michael@0 | 84 | <div class="vstripe" style="left: 89px"></div> |
| michael@0 | 85 | <div class="vstripe" style="left: 150px"></div> |
| michael@0 | 86 | <div class="vstripe" style="left: 211px"></div> |
| michael@0 | 87 | <div class="vstripe" style="left: 272px"></div> |
| michael@0 | 88 | <div class="vstripe" style="left: 333px"></div> |
| michael@0 | 89 | |
| michael@0 | 90 | </body> |
| michael@0 | 91 | </html> |
