<!DOCTYPE html> | |
<style> | |
#flexbox { | |
width: 500px; | |
display: flex; | |
direction: rtl; | |
} | |
#redbox { | |
background: red; | |
flex: 1; | |
} | |
#greenbox { | |
background: green; | |
flex: 1; | |
} | |
</style> | |
<p>There should be a green box followed by a red box, both on the same line. | |
<div id="flexbox"> | |
<div id="redbox">A</div> | |
<div id="greenbox">B</div> | |
</div> |