| OLD | NEW |
| 1 <!DOCTYPE html> | 1 <!DOCTYPE html> |
| 2 <html> | 2 <html> |
| 3 <link href="resources/flexbox.css" rel="stylesheet"> | 3 <link href="resources/flexbox.css" rel="stylesheet"> |
| 4 <style> | 4 <style> |
| 5 .flexbox { | 5 .flexbox { |
| 6 border: 5px solid green; | 6 border: 5px solid green; |
| 7 position: relative; | 7 position: relative; |
| 8 width: 50px; | 8 width: 50px; |
| 9 } | 9 } |
| 10 | 10 |
| 11 .inline-flexbox { | 11 .inline-flexbox { |
| 12 border: 5px solid green; | 12 border: 5px solid green; |
| 13 position: relative; | 13 position: relative; |
| 14 height: 50px; | 14 height: 50px; |
| 15 } | 15 } |
| 16 | 16 |
| 17 .overflow { | 17 .overflow { |
| 18 border: 1px solid red; | 18 border: 1px solid red; |
| 19 overflow: auto; | 19 overflow: auto; |
| 20 min-width: 0; |
| 21 min-height: 0; |
| 20 } | 22 } |
| 21 | 23 |
| 22 .vertical { | 24 .vertical { |
| 23 -webkit-writing-mode: vertical-rl; | 25 -webkit-writing-mode: vertical-rl; |
| 24 } | 26 } |
| 25 </style> | 27 </style> |
| 26 <script src="../../resources/check-layout.js"></script> | 28 <script src="../../resources/check-layout.js"></script> |
| 27 <body onload="checkLayout('.flexbox'); checkLayout('.inline-flexbox')"> | 29 <body onload="checkLayout('.flexbox'); checkLayout('.inline-flexbox')"> |
| 28 <div class="flexbox" data-expected-height="47"> | 30 <div class="flexbox" data-expected-height="47"> |
| 29 <div class="overflow"><div style="width: 100px; height: 20px"></div></div> | 31 <div class="overflow"><div style="width: 100px; height: 20px"></div></div> |
| (...skipping 52 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 82 </div> | 84 </div> |
| 83 | 85 |
| 84 <div class="inline-flexbox column vertical" data-expected-width="32"> | 86 <div class="inline-flexbox column vertical" data-expected-width="32"> |
| 85 <div class="overflow align-self-baseline"><div style="width: 20px; height: 100
px"></div></div> | 87 <div class="overflow align-self-baseline"><div style="width: 20px; height: 100
px"></div></div> |
| 86 </div> | 88 </div> |
| 87 | 89 |
| 88 <div class="inline-flexbox column-reverse vertical" data-expected-width="32"> | 90 <div class="inline-flexbox column-reverse vertical" data-expected-width="32"> |
| 89 <div class="overflow align-self-baseline"><div style="width: 20px; height: 100
px"></div></div> | 91 <div class="overflow align-self-baseline"><div style="width: 20px; height: 100
px"></div></div> |
| 90 </div> | 92 </div> |
| 91 </body> | 93 </body> |
| 92 </html> | 94 </html> |
| OLD | NEW |