| <head> |
| <title>Test for http://bugs.webkit.org/show_bug.cgi?id=5164</title> |
| <style type="text/css"> |
| div.bar { height: 4px; background-color: rgba(0, 0, 0, 0.5); } |
| td.green { background-color: green; } |
| td.black { background-color: black; } |
| td.red { background-color: #0f0; } |
| td.greenOverlay { background-color: rgba(0, 255, 0, 0.5); } |
| td.blackOverlay { background-color: rgba(0, 0, 0, 0.5); } |
| td.sep { width: 10px; } |
| </style> |
| </head> |
| <body> |
| <div style="background-color: #0f0; width: 100px; height: 100px;"> |
| <div><div class="bar" style="width: 100px"></div></div> |
| <div style="width: 1005px"><div class="bar" style="width: 10%"></div></div> |
| <div style="width: 995px"><div class="bar" style="width: 10.1%"></div></div> |
| <div style="width: 985px"><div class="bar" style="width: 10.2%"></div></div> |
| <div style="width: 975px"><div class="bar" style="width: 10.3%"></div></div> |
| <div style="width: 965px"><div class="bar" style="width: 10.4%"></div></div> |
| <div style="width: 955px"><div class="bar" style="width: 10.5%"></div></div> |
| <div style="width: 945px"><div class="bar" style="width: 10.6%"></div></div> |
| <div style="width: 935px"><div class="bar" style="width: 10.7%"></div></div> |
| <div style="width: 930px"><div class="bar" style="width: 10.8%"></div></div> |
| <div style="width: 920px"><div class="bar" style="width: 10.9%"></div></div> |
| <div style="width: 910px"><div class="bar" style="width: 11%"></div></div> |
| <div style="width: 910px"><div class="bar" style="width: 11.1%"></div></div> |
| <div style="width: 900px"><div class="bar" style="width: 11.2%"></div></div> |
| <div style="width: 890px"><div class="bar" style="width: 11.3%"></div></div> |
| <div style="width: 885px"><div class="bar" style="width: 11.4%"></div></div> |
| <div style="width: 875px"><div class="bar" style="width: 11.5%"></div></div> |
| <div style="width: 870px"><div class="bar" style="width: 11.6%"></div></div> |
| <div style="width: 860px"><div class="bar" style="width: 11.7%"></div></div> |
| <div style="width: 850px"><div class="bar" style="width: 11.8%"></div></div> |
| <div style="width: 845px"><div class="bar" style="width: 11.9%"></div></div> |
| <div style="width: 840px"><div class="bar" style="width: 12%"></div></div> |
| <div style="width: 835px"><div class="bar" style="width: 12.1%"></div></div> |
| <div style="width: 825px"><div class="bar" style="width: 12.2%"></div></div> |
| <div style="width: 815px"><div class="bar" style="width: 12.3%"></div></div> |
| </div> |
| <br> |
| <div style="position: relative;"> |
| <table style="position: absolute; top: 0; left: 0; " cellpadding="0" cellspacing="0"> |
| <tr style="height: 20px;"> |
| <td class="red" style="width: 11px;"></td> |
| <td class="black sep"></td> |
| <td class="red" style="width: 13px;"></td> |
| <td class="black sep"></td> |
| <td class="red" style="width: 15px;"></td> |
| <td class="black sep"></td> |
| <td class="red" style="width: 17px;"></td> |
| <td class="black sep"></td> |
| <td class="red" style="width: 20px;"></td> |
| <td class="black sep"></td> |
| <td class="red" style="width: 21px;"></td> |
| <td class="black sep"></td> |
| <td class="red" style="width: 23px;"></td> |
| <td class="black sep"></td> |
| <td class="red" style="width: 25px;"></td> |
| <td class="black sep"></td> |
| <td class="red" style="width: 27px;"></td> |
| <td class="black sep"></td> |
| <td class="red" style="width: 30px;"></td> |
| <td></td> |
| </tr> |
| </table> |
| <table style="position: absolute; top: 0; left: 0; width: 1000px;" cellpadding="0" cellspacing="0"> |
| <tr style="height: 20px;"> |
| <td class="blackOverlay" style="width: 1.2%;"> </td> |
| <td class="greenOverlay sep"> </td> |
| <td class="blackOverlay" style="width: 1.4%;"> </td> |
| <td class="greenOverlay sep"> </td> |
| <td class="blackOverlay" style="width: 1.6%;"> </td> |
| <td class="greenOverlay sep"> </td> |
| <td class="blackOverlay" style="width: 1.8%;"> </td> |
| <td class="greenOverlay sep"> </td> |
| <td class="blackOverlay" style="width: 2%;"> </td> |
| <td class="greenOverlay sep"> </td> |
| <td class="blackOverlay" style="width: 2.2%;"> </td> |
| <td class="greenOverlay sep"> </td> |
| <td class="blackOverlay" style="width: 2.4%;"> </td> |
| <td class="greenOverlay sep"></td> |
| <td class="blackOverlay" style="width: 2.6%;"> </td> |
| <td class="greenOverlay sep"> </td> |
| <td class="blackOverlay" style="width: 2.8%;"> </td> |
| <td class="greenOverlay sep"> </td> |
| <td class="blackOverlay" style="width: 3%;"> </td> |
| <td> </td> |
| </tr> |
| </table> |
| </div> |
| </body> |
| </html> |
