layout/reftests/table-width/percent-basis-ref.html

changeset 0
6474c204b198
     1.1 --- /dev/null	Thu Jan 01 00:00:00 1970 +0000
     1.2 +++ b/layout/reftests/table-width/percent-basis-ref.html	Wed Dec 31 06:09:35 2014 +0100
     1.3 @@ -0,0 +1,65 @@
     1.4 +<!DOCTYPE HTML>
     1.5 +<html>
     1.6 +<head>
     1.7 +<title>basis of percentage widths</title>
     1.8 +<style type="text/css">
     1.9 +
    1.10 +td { border-width: 0; }
    1.11 +td div { border: 3px inset blue; padding: 3px; }
    1.12 +
    1.13 +</style>
    1.14 +</head>
    1.15 +<body>
    1.16 +
    1.17 +<!--
    1.18 +
    1.19 +  The difference between the border-box width of the table and the width allocated to the columns is:
    1.20 +
    1.21 +  2px = table border-left-width
    1.22 +  9px = table padding-left
    1.23 +  25px = 5 * table border-spacing-x
    1.24 +  5px = table padding-right
    1.25 +  2px = table border-left-width
    1.26 +  =================================
    1.27 +  43px
    1.28 +
    1.29 +  -->
    1.30 +
    1.31 +<table cellpadding="0" cellspacing="5" border="2" style="padding: 3px 5px 7px 9px">
    1.32 +  <tr>
    1.33 +    <td><div style="width: 38px">x</div></td>
    1.34 +    <td><div style="width: 38px">x</div></td>
    1.35 +    <td><div style="width: 38px">x</div></td>
    1.36 +    <td><div style="width: 38px">x</div></td>
    1.37 +  </tr>
    1.38 +</table>
    1.39 +
    1.40 +<table cellpadding="0" cellspacing="5" border="2" style="padding: 3px 5px 7px 9px">
    1.41 +  <tr>
    1.42 +    <td><div style="width: 38px">x</div></td>
    1.43 +    <td><div style="width: 38px">x</div></td>
    1.44 +    <td><div style="width: 38px">x</div></td>
    1.45 +    <td><div style="width: 38px">x</div></td>
    1.46 +  </tr>
    1.47 +</table>
    1.48 +
    1.49 +<table cellpadding="0" cellspacing="5" border="2" style="padding: 3px 5px 7px 9px">
    1.50 +  <tr>
    1.51 +    <td><div style="width: 88px">x</div></td>
    1.52 +    <td><div style="width: 38px">x</div></td>
    1.53 +    <td><div style="width: 113px">x</div></td>
    1.54 +    <td><div style="width: 113px">x</div></td>
    1.55 +  </tr>
    1.56 +</table>
    1.57 +
    1.58 +<table cellpadding="0" cellspacing="5" border="2" style="padding: 3px 5px 7px 9px">
    1.59 +  <tr>
    1.60 +    <td><div style="width: 33px">x</div></td>
    1.61 +    <td><div style="width: 23px">x</div></td>
    1.62 +    <td><div style="width: 38px">x</div></td>
    1.63 +    <td><div style="width: 38px">x</div></td>
    1.64 +  </tr>
    1.65 +</table>
    1.66 +
    1.67 +</body>
    1.68 +</html>

mercurial