layout/reftests/box-properties/box-sizing-4-ref.html

Wed, 31 Dec 2014 13:27:57 +0100

author
Michael Schloh von Bennewitz <michael@schloh.com>
date
Wed, 31 Dec 2014 13:27:57 +0100
branch
TOR_BUG_3246
changeset 6
8bccb770b82d
permissions
-rw-r--r--

Ignore runtime configuration files generated during quality assurance.

michael@0 1 <!DOCTYPE html>
michael@0 2 <html lang="en-US">
michael@0 3 <head>
michael@0 4 <title>test of box-sizing</title>
michael@0 5 <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
michael@0 6 <meta http-equiv="Content-Style-Type" content="text/css">
michael@0 7 <style type="text/css">
michael@0 8
michael@0 9 body { font-size: 10px; line-height: 1; }
michael@0 10 table { border-spacing: 0; margin: 0 100px; }
michael@0 11 td { border: 1px solid; padding: 1px solid; }
michael@0 12
michael@0 13 td > div { width: 100px; }
michael@0 14
michael@0 15 td > div > div {
michael@0 16 margin-left: 1px;
michael@0 17 border-left: 2px solid;
michael@0 18 padding-left: 4px;
michael@0 19 padding-right: 8px;
michael@0 20 border-right: 16px solid;
michael@0 21 margin-right: 32px;
michael@0 22
michael@0 23 background: yellow;
michael@0 24 margin-bottom: 10px;
michael@0 25 float: right;
michael@0 26 clear: right;
michael@0 27 text-align: right;
michael@0 28 height: 40px;
michael@0 29 right: 0;
michael@0 30 }
michael@0 31
michael@0 32 </style>
michael@0 33 </head>
michael@0 34 <body>
michael@0 35
michael@0 36 <table><tr>
michael@0 37
michael@0 38 <td id="bscontent"><div>
michael@0 39
michael@0 40 <!-- box-sizing: content-box -->
michael@0 41 <div>A B</div>
michael@0 42 <div>A B</div>
michael@0 43 <div>A<br>B</div>
michael@0 44 <div>A B</div>
michael@0 45 <div style="width: 37px">A B</div>
michael@0 46 <div style="width: 50px">A B</div>
michael@0 47 <div style="width: 60px">A B</div>
michael@0 48
michael@0 49 </div></td>
michael@0 50
michael@0 51 <td id="bspadding"><div>
michael@0 52 <!-- box-sizing: padding-box -->
michael@0 53 <div>A B</div>
michael@0 54 <div>A B</div>
michael@0 55 <div>A<br>B</div>
michael@0 56 <div>A B</div>
michael@0 57 <div style="width: 37px">A B</div>
michael@0 58 <div style="width: 38px">A B</div>
michael@0 59 <div style="width: 48px">A B</div>
michael@0 60
michael@0 61 </div></td>
michael@0 62
michael@0 63 <td id="bsborder"><div>
michael@0 64 <!-- box-sizing: border-box -->
michael@0 65 <div>A B</div>
michael@0 66 <div>A B</div>
michael@0 67 <div>A<br>B</div>
michael@0 68 <div>A B</div>
michael@0 69 <div style="width: 37px">A B</div>
michael@0 70 <div style="width: 20px">A B</div>
michael@0 71 <div style="width: 30px">A B</div>
michael@0 72
michael@0 73 </div></td>
michael@0 74
michael@0 75 </tr></table>
michael@0 76
michael@0 77 </body>
michael@0 78 </html>

mercurial