| 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 |