1 <!DOCTYPE html>
2 <html><head><meta charset="utf-8">
3 <title>CSS Basic User Interface Test: box-sizing:border-box floors to 0</title>
4 <link href="http://florian.rivoal.net/" rel="author" title="Florian Rivoal">
5 <link href="https://drafts.csswg.org/css-ui-3/#box-sizing" rel="help">
6 <meta content="" name="flags">
7 <link href="reference/box-sizing-001-ref.htm" rel="match">
8 <link href="reference/ref-filled-green-100px-square.htm" rel="match">
9 <meta content="Floor width and height computation to 0 as they cannot be negative." name="assert">
10 <style>
11 #red {
12 position: absolute;
13 width: 100px;
14 height: 100px;
15 background:red;
16 z-index: -1;
17 }
18 #test {
19 box-sizing: border-box;
20 border: 50px green solid;
21 width: 10px;
22 height: 10px;
23 }
24 </style>
25 </head><body>
26 <p>Test passes if there is a filled green square and <strong>no red</strong>.</p>
27 <div id="red"></div>
28 <div id="test"></div>
29
30 </body></html>