OLD | NEW |
1 <!DOCTYPE html> | 1 <!DOCTYPE html> |
2 <html> | 2 <html> |
3 <style> | 3 <style> |
4 .container { | 4 .container { |
5 position: relative; | 5 position: relative; |
6 background-color: pink; | 6 background-color: pink; |
7 outline: 1px solid black; | 7 outline: 1px solid black; |
8 display: inline-block; | 8 display: inline-block; |
9 } | 9 } |
10 .flexbox { | 10 .flexbox { |
(...skipping 37 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
48 .flexbox > div { | 48 .flexbox > div { |
49 margin: 13px 2px 17px 8px; | 49 margin: 13px 2px 17px 8px; |
50 background-color: blue; | 50 background-color: blue; |
51 } | 51 } |
52 </style> | 52 </style> |
53 <script src="../../resources/check-layout.js"></script> | 53 <script src="../../resources/check-layout.js"></script> |
54 <body onload="checkLayout('.flexbox')"> | 54 <body onload="checkLayout('.flexbox')"> |
55 | 55 |
56 <script> | 56 <script> |
57 | 57 |
58 // The vertical test cases are failing because of the orthogonal writing modes. | |
59 // https://bugs.webkit.org/show_bug.cgi?id=70769 | |
60 var writingModes = ['horizontal-tb', 'horizontal-bt', 'vertical-lr', 'vertical-r
l']; | 58 var writingModes = ['horizontal-tb', 'horizontal-bt', 'vertical-lr', 'vertical-r
l']; |
61 var flexFlows = ['row', 'column', 'row-reverse', 'column-reverse']; | 59 var flexFlows = ['row', 'column', 'row-reverse', 'column-reverse']; |
62 var directions = ['rtl', 'ltr']; | 60 var directions = ['rtl', 'ltr']; |
63 | 61 |
64 writingModes.forEach(function(writingMode) { | 62 writingModes.forEach(function(writingMode) { |
65 flexFlows.forEach(function(flexFlow) { | 63 flexFlows.forEach(function(flexFlow) { |
66 directions.forEach(function(direction) { | 64 directions.forEach(function(direction) { |
67 var flexboxClassName = writingMode + ' ' + direction + ' ' + flexFlo
w; | 65 var flexboxClassName = writingMode + ' ' + direction + ' ' + flexFlo
w; |
68 var title = document.createElement('div'); | 66 var title = document.createElement('div'); |
69 title.className = 'title'; | 67 title.className = 'title'; |
(...skipping 12 matching lines...) Expand all Loading... |
82 '<div style="flex: 1 auto; width: 20px; height: 20px;" ' + flexI
temExpectations + '></div>\n' + | 80 '<div style="flex: 1 auto; width: 20px; height: 20px;" ' + flexI
temExpectations + '></div>\n' + |
83 '</div>'; | 81 '</div>'; |
84 | 82 |
85 document.body.appendChild(container); | 83 document.body.appendChild(container); |
86 }) | 84 }) |
87 }) | 85 }) |
88 }) | 86 }) |
89 </script> | 87 </script> |
90 </body> | 88 </body> |
91 </html> | 89 </html> |
OLD | NEW |