flexbox_rtl-direction-ref.html (620B)
1 <!DOCTYPE html> 2 <title>flexbox | flex-direction: column-reverse | rtl</title> 3 <link rel="author" href="http://opera.com" title="Opera Software"> 4 <style> 5 div { 6 background: blue; 7 margin: 1em 0; 8 border: 1px solid black; 9 } 10 div::after { 11 content: ""; 12 clear: both; 13 display: block; 14 } 15 span { 16 text-align: right; 17 background: white; 18 margin: 1em 1em 0; 19 width: 8em; 20 float: right; 21 clear: both; 22 } 23 .test { 24 background: #ffcc00; 25 } 26 span~span { 27 margin: 2em 1em 0; 28 } 29 span:last-child { 30 margin-bottom: 1em; 31 } 32 </style> 33 34 <div> 35 <span>filler</span> 36 <span>filler</span> 37 <span>filler</span> 38 <span class="test">filler</span> 39 </div>