CSSにおけるフレックス要素の逆順行配置
プロパティ flex-direction の値 row-reverse は、
ブロックを行に配置し、それらを右端に押し付けることを可能にします。
これにより順序が逆転し、最初のブロックが最も右側に配置されます:
<div class="parent">
<div class="child">1</div>
<div class="child">2</div>
<div class="child">3</div>
</div>
.parent {
display: flex;
flex-direction: row-reverse;
width: 300px;
height: 200px;
border: 1px solid red;
}
.child {
width: 50px;
height: 50px;
border: 1px solid green;
}
:
