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

Side by Side Diff: LayoutTests/css3/flexbox/multiline-reverse-wrap-baseline.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
OLDNEW
1 <!DOCTYPE html> 1 <!DOCTYPE html>
2 <html> 2 <html>
3 <style> 3 <style>
4 .flexbox { 4 .flexbox {
5 width: 200px; 5 width: 200px;
6 display: -webkit-flex; 6 display: flex;
7 background-color: #aaa; 7 background-color: #aaa;
8 position: relative; 8 position: relative;
9 -webkit-flex-wrap: wrap-reverse; 9 flex-wrap: wrap-reverse;
10 -webkit-align-items: baseline; 10 align-items: baseline;
11 margin-bottom: 10px; 11 margin-bottom: 10px;
12 } 12 }
13 .flexbox > div { 13 .flexbox > div {
14 border: 0; 14 border: 0;
15 } 15 }
16 16
17 .flexbox :nth-child(1) { 17 .flexbox :nth-child(1) {
18 background-color: lightblue; 18 background-color: lightblue;
19 } 19 }
20 .flexbox :nth-child(2) { 20 .flexbox :nth-child(2) {
21 background-color: lightgreen; 21 background-color: lightgreen;
22 } 22 }
23 .flexbox :nth-child(3) { 23 .flexbox :nth-child(3) {
24 background-color: pink; 24 background-color: pink;
25 } 25 }
26 .flexbox :nth-child(4) { 26 .flexbox :nth-child(4) {
27 background-color: yellow; 27 background-color: yellow;
28 } 28 }
29 </style> 29 </style>
30 <body> 30 <body>
31 <p>Test to make sure that wrap-reverse flips the cross axis directions and items 31 <p>Test to make sure that wrap-reverse flips the cross axis directions and items
32 with baseline alignment are aligned to cross axis start.</p> 32 with baseline alignment are aligned to cross axis start.</p>
33 33
34 <div class="flexbox"> 34 <div class="flexbox">
35 <div style="-webkit-flex: 1 0 100px;">first<br>first<br>first</div> 35 <div style="flex: 1 0 100px;">first<br>first<br>first</div>
36 <div style="-webkit-flex: 1 0 100px;">second</div> 36 <div style="flex: 1 0 100px;">second</div>
37 <div style="-webkit-flex: 1 0 100px; margin-top: 5px">third</div> 37 <div style="flex: 1 0 100px; margin-top: 5px">third</div>
38 <div style="-webkit-flex: 1 0 100px;">fourth<br>fourth</div> 38 <div style="flex: 1 0 100px;">fourth<br>fourth</div>
39 </div> 39 </div>
40 40
41 <div class="flexbox"> 41 <div class="flexbox">
42 <div style="-webkit-flex: 1 0 100px;">first<br>first<br>first</div> 42 <div style="flex: 1 0 100px;">first<br>first<br>first</div>
43 <div style="-webkit-flex: 1 0 100px;">second</div> 43 <div style="flex: 1 0 100px;">second</div>
44 <div style="-webkit-flex: 1 0 100px;">third</div> 44 <div style="flex: 1 0 100px;">third</div>
45 <div style="-webkit-flex: 1 0 100px; margin-bottom: 5px">fourth<br>fourth</div > 45 <div style="flex: 1 0 100px; margin-bottom: 5px">fourth<br>fourth</div>
46 </div> 46 </div>
47 47
48 <div class="flexbox" style="width: 300px;"> 48 <div class="flexbox" style="width: 300px;">
49 <div style="-webkit-flex: 1 0 100px; -webkit-align-self: flex-start; height: 1 00px">first</div> 49 <div style="flex: 1 0 100px; align-self: flex-start; height: 100px">first</div >
50 <div style="-webkit-flex: 1 0 100px;">second</div> 50 <div style="flex: 1 0 100px;">second</div>
51 <div style="-webkit-flex: 1 0 100px;">third<br>third</div> 51 <div style="flex: 1 0 100px;">third<br>third</div>
52 </div> 52 </div>
53 53
54 </body> 54 </body>
55 </html> 55 </html>
OLDNEW
« no previous file with comments | « LayoutTests/css3/flexbox/multiline-min-max.html ('k') | LayoutTests/css3/flexbox/multiline-reverse-wrap-overflow.html » ('j') | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698