flexbox-order-from-lowest.html (907B)
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <title>CSS Test: flex container layout starts with lowest order item</title> 5 <link rel="author" title="Sylvain Galineau" href="mailto:galineau@adobe.com"> 6 <link rel="reviewer" title="Arron Eicholz" href="mailto:arronei@microsoft.com"> 7 <link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#order-property"> 8 <meta name="assert" content="This test check that a flex container layous out its content starting with the lowest numbered ordinal group and going up"> 9 <style> 10 #test { 11 display: flex; 12 } 13 14 #leftmost { 15 order: -1; 16 } 17 18 #middle { 19 order:0; 20 } 21 22 #rightmost { 23 order:1; 24 } 25 </style> 26 </head> 27 <body> 28 <p>Test passes if the paragraph below reads 'First,Second,Third'.</p> 29 <div id="test"> 30 <p id="rightmost">Third</p> 31 <p id="middle">Second,</p> 32 <p id="leftmost">First,</p> 33 </div> 34 </body> 35 </html>