REGRESSION: flexbox content-size fails to exclude scrollbar
[WebKit-https.git] / LayoutTests / css3 / flexbox / content-height-with-scrollbars.html
1 <!DOCTYPE html>
2 <html>
3 <head>
4 <style>
5 .outer {
6     display: -webkit-flex;
7     -webkit-flex-flow: column;
8     height: 100px;
9     overflow: scroll;
10 }
11 .outer > :nth-child(1) {
12     background-color: lightgreen;
13 }
14 .outer > :nth-child(2) {
15     background-color: lightblue;
16 }
17 </style>
18 </head>
19 <body>
20 <p>This tests that when setting the height of a flex item to a percentage
21 height, we use the content height with scrollbars. The content should not be
22 scrollable in any of the test cases below.</p>
23
24 <div class="outer">
25   <div style="height: 100%"></div>
26 </div>
27
28 <div class="outer">
29   <div style="height: 100%; box-sizing: border-box; border: 5px solid green"></div>
30 </div>
31
32 <div class="outer" style="-webkit-flex-wrap: wrap">
33   <div style="height: 50px; width: 50%;"></div>
34   <div style="height: 50px; width: 50%; background-color: lightblue"></div>
35 </div>
36
37 <div class="outer" style="-webkit-flex-wrap: wrap; height: auto; max-height: 100px; padding: 10px;">
38   <div style="height: 50px; width: 50%;"></div>
39   <div style="height: 50px; width: 50%; background-color: lightblue"></div>
40 </div>
41 </body>
42 </html>