Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(165)

Issues Search
    My Issues | Starred     Open | Closed | All

Side by Side Diff: LayoutTests/css3/flexbox/columns-auto-size.html

Issue 1088633002: Unprefix flexbox tests. (Closed) Base URL: svn://svn.chromium.org/blink/trunk
Patch Set: whoops, a > went missing Created 5 years, 8 months ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View unified diff | Download patch | Annotate | Revision Log
« no previous file with comments | « LayoutTests/css3/flexbox/box-sizing.html ('k') | LayoutTests/css3/flexbox/columns-height-set-via-top-bottom.html » ('j') | no next file with comments »
Toggle Intra-line Diffs ('i') | Expand Comments ('e') | Collapse Comments ('c') | Show Comments Hide Comments ('s')
OLDNEW
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 body { 5 body {
6 margin: 0; 6 margin: 0;
7 } 7 }
8 8
9 .flexbox { 9 .flexbox {
10 background-color: #aaa; 10 background-color: #aaa;
(...skipping 26 matching lines...) Expand all
37 .flexbox > :nth-child(4) { 37 .flexbox > :nth-child(4) {
38 background-color: orange; 38 background-color: orange;
39 } 39 }
40 .child-div { 40 .child-div {
41 background-color: yellow; 41 background-color: yellow;
42 } 42 }
43 </style> 43 </style>
44 <script src="../../resources/check-layout.js"></script> 44 <script src="../../resources/check-layout.js"></script>
45 <body onload="checkLayout('.flexbox')"> 45 <body onload="checkLayout('.flexbox')">
46 <div class="flexbox column horizontal"> 46 <div class="flexbox column horizontal">
47 <div data-expected-height="10" data-offset-y="0" style="-webkit-flex: 1 0 10px ; -moz-flex: 1 0 10px"></div> 47 <div data-expected-height="10" data-offset-y="0" style="flex: 1 0 10px;"></div >
48 <div data-expected-height="10" data-offset-y="10" style="height: 10px;"></div> 48 <div data-expected-height="10" data-offset-y="10" style="height: 10px;"></div>
49 <div data-expected-height="10" data-offset-y="20"><div data-expected-height="1 0" data-offset-y="20" style="height: 10px"></div></div> 49 <div data-expected-height="10" data-offset-y="20"><div data-expected-height="1 0" data-offset-y="20" style="height: 10px"></div></div>
50 </div> 50 </div>
51 51
52 <!-- The last div is sized to 0 because there is no available space, however its child overflows. --> 52 <!-- The last div is sized to 0 because there is no available space, however its child overflows. -->
53 <div class="flexbox column horizontal"> 53 <div class="flexbox column horizontal">
54 <div data-expected-height="0" data-offset-y="0" style="-webkit-flex: 1; -moz-f lex: 1"></div> 54 <div data-expected-height="0" data-offset-y="0" style="flex: 1;"></div>
55 <div data-expected-height="10" data-offset-y="0" style="height: 10px;"></div> 55 <div data-expected-height="10" data-offset-y="0" style="height: 10px;"></div>
56 <div data-expected-height="10" data-offset-y="10" style="-webkit-flex: 1 auto; -moz-flex: 1 auto"><div style="height: 10px"></div></div> 56 <div data-expected-height="10" data-offset-y="10" style="flex: 1 auto;"><div s tyle="height: 10px"></div></div>
57 <div data-expected-height="10" data-offset-y="20" style="min-height: 0; -webki t-flex: 1; -moz-flex: 1"><div data-expected-height="10" data-offset-y="20" class ="child-div" style="height: 10px"></div></div> 57 <div data-expected-height="10" data-offset-y="20" style="min-height: 0; flex: 1;"><div data-expected-height="10" data-offset-y="20" class="child-div" style="h eight: 10px"></div></div>
58 </div> 58 </div>
59 59
60 <div class="flexbox column horizontal"> 60 <div class="flexbox column horizontal">
61 <div data-expected-height="10" data-offset-y="10" style="-webkit-flex: 1 0 10p x; -moz-flex: 1 0 10px; margin-top: 10px;"></div> 61 <div data-expected-height="10" data-offset-y="10" style="flex: 1 0 10px; margi n-top: 10px;"></div>
62 <div data-expected-height="10" data-offset-y="20" style="height: 10px; margin- bottom: 20px;"></div> 62 <div data-expected-height="10" data-offset-y="20" style="height: 10px; margin- bottom: 20px;"></div>
63 <div data-expected-height="20" data-offset-y="50" style="padding-top: 10px"><d iv data-expected-height="10" data-offset-y="60" style="height: 10px"></div></div > 63 <div data-expected-height="20" data-offset-y="50" style="padding-top: 10px"><d iv data-expected-height="10" data-offset-y="60" style="height: 10px"></div></div >
64 </div> 64 </div>
65 65
66 <!-- Same as previous test case but with a justify-content set. Since there's n o 66 <!-- Same as previous test case but with a justify-content set. Since there's n o
67 available space, it should layout the same. --> 67 available space, it should layout the same. -->
68 <div class="flexbox column horizontal justify-content-space-between"> 68 <div class="flexbox column horizontal justify-content-space-between">
69 <div data-expected-height="10" data-offset-y="10" style="-webkit-flex: 1 0 10p x; -moz-flex: 1 0 10px; margin-top: 10px;"></div> 69 <div data-expected-height="10" data-offset-y="10" style="flex: 1 0 10px; margi n-top: 10px;"></div>
70 <div data-expected-height="10" data-offset-y="20" style="height: 10px; margin- bottom: 20px;"></div> 70 <div data-expected-height="10" data-offset-y="20" style="height: 10px; margin- bottom: 20px;"></div>
71 <div data-expected-height="20" data-offset-y="50" style="padding-top: 10px"><d iv data-expected-height="10" data-offset-y="60" style="height: 10px"></div></div > 71 <div data-expected-height="20" data-offset-y="50" style="padding-top: 10px"><d iv data-expected-height="10" data-offset-y="60" style="height: 10px"></div></div >
72 </div> 72 </div>
73 73
74 <div class="flexbox column horizontal" data-expected-height="20"> 74 <div class="flexbox column horizontal" data-expected-height="20">
75 <div data-expected-height="10" data-offset-y="0" style="-webkit-flex: 0 1 auto ; -moz-flex: 0 1 auto"><div style="height: 10px"></div></div> 75 <div data-expected-height="10" data-offset-y="0" style="flex: 0 1 auto;"><div style="height: 10px"></div></div>
76 <div data-expected-height="10" data-offset-y="10" style="-webkit-flex: 0 2 aut o; -moz-flex: 0 2 auto"><div style="height: 10px"></div></div> 76 <div data-expected-height="10" data-offset-y="10" style="flex: 0 2 auto;"><div style="height: 10px"></div></div>
77 </div> 77 </div>
78 78
79 <div class="flexbox column horizontal" style="min-height: 10px" data-expected-he ight="20"> 79 <div class="flexbox column horizontal" style="min-height: 10px" data-expected-he ight="20">
80 <div data-expected-height="10" data-offset-y="0" style="-webkit-flex: 0 1 auto ; -moz-flex: 0 1 auto"><div style="height: 10px"></div></div> 80 <div data-expected-height="10" data-offset-y="0" style="flex: 0 1 auto;"><div style="height: 10px"></div></div>
81 <div data-expected-height="10" data-offset-y="10" style="-webkit-flex: 0 2 aut o; -moz-flex: 0 2 auto"><div style="height: 10px"></div></div> 81 <div data-expected-height="10" data-offset-y="10" style="flex: 0 2 auto;"><div style="height: 10px"></div></div>
82 </div> 82 </div>
83 83
84 <div class="flexbox column horizontal" style="min-height: 5px; max-height: 17px; " data-expected-height="17"> 84 <div class="flexbox column horizontal" style="min-height: 5px; max-height: 17px; " data-expected-height="17">
85 <div data-expected-height="9" data-offset-y="0" style="min-height: 0; -webkit- flex: 0 1 auto; -moz-flex: 0 1 auto"><div style="height: 10px"></div></div> 85 <div data-expected-height="9" data-offset-y="0" style="min-height: 0; flex: 0 1 auto;"><div style="height: 10px"></div></div>
86 <div data-expected-height="8" data-offset-y="9" style="min-height: 0; -webkit- flex: 0 2 auto; -moz-flex: 0 2 auto"><div style="height: 10px"></div></div> 86 <div data-expected-height="8" data-offset-y="9" style="min-height: 0; flex: 0 2 auto;"><div style="height: 10px"></div></div>
87 </div> 87 </div>
88 88
89 <div class="flexbox column horizontal" style="min-height: 5px; max-height: 30px; padding-top: 1px; padding-bottom: 2px;" data-expected-height="33"> 89 <div class="flexbox column horizontal" style="min-height: 5px; max-height: 30px; padding-top: 1px; padding-bottom: 2px;" data-expected-height="33">
90 <div data-expected-height="15" data-offset-y="1" style="min-height: 0; -webkit -flex: 0 1 auto; -moz-flex: 0 1 auto"><div style="height: 20px"></div></div> 90 <div data-expected-height="15" data-offset-y="1" style="min-height: 0; flex: 0 1 auto;"><div style="height: 20px"></div></div>
91 <div data-expected-height="15" data-offset-y="16" style="min-height: 0; -webki t-flex: 0 1 auto; -moz-flex: 0 1 auto"><div style="height: 20px"></div></div> 91 <div data-expected-height="15" data-offset-y="16" style="min-height: 0; flex: 0 1 auto;"><div style="height: 20px"></div></div>
92 </div> 92 </div>
93 93
94 <div class="flexbox column horizontal"> 94 <div class="flexbox column horizontal">
95 <div data-expected-client-height="10" data-offset-y="0" style="overflow: scrol l"><div data-expected-height=10 style="height: 10px"></div></div> 95 <div data-expected-client-height="10" data-offset-y="0" style="overflow: scrol l"><div data-expected-height=10 style="height: 10px"></div></div>
96 </div> 96 </div>
97 97
98 <div class="flexbox column vertical"> 98 <div class="flexbox column vertical">
99 <div data-expected-width="10" data-offset-x="20" style="-webkit-flex: 1 0 10px ; -moz-flex: 1 0 10px"></div> 99 <div data-expected-width="10" data-offset-x="20" style="flex: 1 0 10px;"></div >
100 <div data-expected-width="10" data-offset-x="10" style="width: 10px;"></div> 100 <div data-expected-width="10" data-offset-x="10" style="width: 10px;"></div>
101 <div data-expected-width="10" data-offset-x="0"><div data-expected-width="10" data-offset-x="0" style="width: 10px"></div></div> 101 <div data-expected-width="10" data-offset-x="0"><div data-expected-width="10" data-offset-x="0" style="width: 10px"></div></div>
102 </div> 102 </div>
103 103
104 <!-- The first div overflows to the left, so give it a margin-left so we can see box it paints. --> 104 <!-- The first div overflows to the left, so give it a margin-left so we can see box it paints. -->
105 <div class="flexbox column vertical" style="margin-left: 100px;"> 105 <div class="flexbox column vertical" style="margin-left: 100px;">
106 <div data-expected-width="50" data-offset-x="20" style="min-width: 0; -webkit- flex: 1; -moz-flex: 1"><div data-expected-width="50" data-offset-x="20" class="c hild-div" style="width: 50px"></div></div> 106 <div data-expected-width="50" data-offset-x="20" style="min-width: 0; flex: 1; "><div data-expected-width="50" data-offset-x="20" class="child-div" style="widt h: 50px"></div></div>
107 <div data-expected-width="0" data-offset-x="20" style="-webkit-flex: 1; -moz-f lex: 1"></div> 107 <div data-expected-width="0" data-offset-x="20" style="flex: 1;"></div>
108 <div data-expected-width="10" data-offset-x="10" style="width: 10px;"></div> 108 <div data-expected-width="10" data-offset-x="10" style="width: 10px;"></div>
109 <div data-expected-width="10" data-offset-x="0" style="-webkit-flex: 1 auto; - moz-flex: 1 auto"><div style="width: 10px"></div></div> 109 <div data-expected-width="10" data-offset-x="0" style="flex: 1 auto;"><div sty le="width: 10px"></div></div>
110 </div> 110 </div>
111 111
112 </body> 112 </body>
113 </html> 113 </html>
OLDNEW
« no previous file with comments | « LayoutTests/css3/flexbox/box-sizing.html ('k') | LayoutTests/css3/flexbox/columns-height-set-via-top-bottom.html » ('j') | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698