Move parseFontFaceDescriptor to CSSPropertyParser.cpp
[chromium-blink-merge.git] / third_party / WebKit / LayoutTests / css3 / flexbox / flex-flow-margins-auto-size.html
blobda006a8bfa83b852e104c802fee8fe665f523b7c
1 <!DOCTYPE html>
2 <html>
3 <style>
4 .container {
5 position: relative;
6 background-color: pink;
7 outline: 1px solid black;
8 display: inline-block;
10 .flexbox {
11 display: flex;
12 background-color: grey;
13 margin: 10px 20px 30px 40px;
15 .title {
16 margin-top: 1em;
18 .ltr {
19 direction: ltr;
21 .rtl {
22 direction: rtl;
24 .horizontal-tb {
25 -webkit-writing-mode: horizontal-tb;
27 .horizontal-bt {
28 -webkit-writing-mode: horizontal-bt;
30 .vertical-rl {
31 -webkit-writing-mode: vertical-rl;
33 .vertical-lr {
34 -webkit-writing-mode: vertical-lr;
36 .row {
37 flex-flow: row;
39 .row-reverse {
40 flex-flow: row-reverse;
42 .column {
43 flex-flow: column;
45 .column-reverse {
46 flex-flow: column-reverse;
48 .flexbox > div {
49 margin: 13px 2px 17px 8px;
50 background-color: blue;
52 </style>
53 <script src="../../resources/check-layout.js"></script>
54 <body onload="checkLayout('.flexbox')">
56 <script>
58 var writingModes = ['horizontal-tb', 'horizontal-bt', 'vertical-lr', 'vertical-rl'];
59 var flexFlows = ['row', 'column', 'row-reverse', 'column-reverse'];
60 var directions = ['rtl', 'ltr'];
62 writingModes.forEach(function(writingMode) {
63 flexFlows.forEach(function(flexFlow) {
64 directions.forEach(function(direction) {
65 var flexboxClassName = writingMode + ' ' + direction + ' ' + flexFlow;
66 var title = document.createElement('div');
67 title.className = 'title';
68 title.innerHTML = flexboxClassName;
69 document.body.appendChild(title);
71 var flexboxExpectations = 'data-offset-x="40" data-offset-y="10"';
72 var flexItemExpectations = 'data-expected-width="20" data-expected-height="20" data-offset-x="48" data-offset-y="23"';
74 var container = document.createElement('div');
75 container.className = 'container';
76 container.setAttribute('data-expected-width', 90);
77 container.setAttribute('data-expected-height', 90);
79 container.innerHTML = '<div class="flexbox ' + flexboxClassName + '" ' + flexboxExpectations + '>\n' +
80 '<div style="flex: 1 auto; width: 20px; height: 20px;" ' + flexItemExpectations + '></div>\n' +
81 '</div>';
83 document.body.appendChild(container);
87 </script>
88 </body>
89 </html>