| OLD | NEW |
|---|
| 1 <!DOCTYPE html> | 1 <!DOCTYPE html> |
| 2 <html> | 2 <html> |
| 3 <head> | 3 <head> |
| 4 <link href="resources/flexbox.css" rel="stylesheet"> | 4 <link href="resources/flexbox.css" rel="stylesheet"> |
| 5 <style> | 5 <style> |
| 6 body { | 6 body { |
| 7 margin: 0; | 7 margin: 0; |
| 8 } | 8 } |
| 9 | 9 |
| 10 .flexbox { | 10 .flexbox { |
| 11 background-color: red; | 11 background-color: red; |
| 12 } | 12 } |
| 13 | 13 |
| 14 .vertical-rl { | 14 .vertical-rl { |
| 15 -webkit-writing-mode: vertical-rl; | 15 -webkit-writing-mode: vertical-rl; |
| 16 } | 16 } |
| 17 | 17 |
| 18 .vertical-lr { | 18 .vertical-lr { |
| 19 -webkit-writing-mode: vertical-lr; | 19 -webkit-writing-mode: vertical-lr; |
| 20 } | 20 } |
| 21 | 21 |
| 22 .column > div { | 22 .column > div { |
| 23 -webkit-flex: none; | 23 flex: none; |
| 24 flex: none; | 24 flex: none; |
| 25 background-color: green; | 25 background-color: green; |
| 26 width: 100px; | 26 width: 100px; |
| 27 height: 10px; | 27 height: 10px; |
| 28 } | 28 } |
| 29 | 29 |
| 30 .row > div { | 30 .row > div { |
| 31 background-color: green; | 31 background-color: green; |
| 32 -webkit-flex: 1; | 32 flex: 1; |
| 33 flex: 1; | 33 flex: 1; |
| 34 height: 50px; | 34 height: 50px; |
| 35 min-height: 0; | 35 min-height: 0; |
| 36 } | 36 } |
| 37 | 37 |
| 38 .vertical-lr > .column > div { | 38 .vertical-lr > .column > div { |
| 39 -webkit-flex: none; | 39 flex: none; |
| 40 flex: none; | 40 flex: none; |
| 41 height: 50px; | 41 height: 50px; |
| 42 width: 20px; | 42 width: 20px; |
| 43 } | 43 } |
| 44 | 44 |
| 45 .vertical-lr > .row > div { | 45 .vertical-lr > .row > div { |
| 46 -webkit-flex: 1; | 46 flex: 1; |
| 47 flex: 1; | 47 flex: 1; |
| 48 width: 100px; | 48 width: 100px; |
| 49 } | 49 } |
| 50 | 50 |
| 51 </style> | 51 </style> |
| 52 </head> | 52 </head> |
| 53 <body> | 53 <body> |
| 54 | 54 |
| 55 This test passes if no red is showing. | 55 This test passes if no red is showing. |
| 56 | 56 |
| (...skipping 78 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 135 <div class="align-self-stretch"></div> | 135 <div class="align-self-stretch"></div> |
| 136 </div> | 136 </div> |
| 137 </div> | 137 </div> |
| 138 | 138 |
| 139 </div> | 139 </div> |
| 140 <!-- FIXME: Add tests for horizontal-bt and vertical-rl. Setting the logical | 140 <!-- FIXME: Add tests for horizontal-bt and vertical-rl. Setting the logical |
| 141 bottom border on these tests cause additional scrollbars to appear. --> | 141 bottom border on these tests cause additional scrollbars to appear. --> |
| 142 | 142 |
| 143 </body> | 143 </body> |
| 144 </html> | 144 </html> |
| OLD | NEW |
|---|
Chromium Code Reviews
