inline-flexで縦積みにした場合の折り返しと、writing-modeで縦積みにした場合の折り返しを確認します。
デモページはこちら

htmlは以下の単純なリスト構造で確認します。

<ul>
  <li>01</li>
  <li>02</li>
  <li>03</li>
  <li>04</li>
  <li>05</li>
  <li>06</li>
  <li>07</li>
  <li>08</li>
</ul>

CSSは全パターン共通でulにdisplay: inline-flexを指定します。

まず、ulにflex-direction: column、flex-wrap: wrapを指定します。writing-modeは指定していません。liが縦積みになり左から右に折り返します。

ul {
  display: inline-flex;
  flex-wrap: wrap;
  flex-direction: column;
}

次に、ulのflex-wrap: wrapをflex-wrap: wrap-reverseに変更します。liの折り返しが右から左に変更されますが、フレックスアイテムがフレックスコンテナからはみ出すバグが発生します。

ul {
  display: inline-flex;
  flex-wrap: wrap-reverse;
  flex-direction: column;
}

ここでwriting-modeを試します。ulからflex-direction: columnを外しflex-wrap: wrapを指定します。そして新たに、writing-mode: vertical-lrを指定します。

writing-modeは内容物の方向を決定します。ulの内容物であるliが縦積み（vertical）になり、左から右（lr）に折り返します。lrはleft to rightの略です。

ただしこのままだと、ulの内容物であるテキストも縦積みになってしまいます。そこでliにwriting-mode: horizontal-tbを指定し、liの内容物であるテキストだけを水平方向に流します。writing-modeの初期値はhorizontal-tbです。

これで、ulのflex-direction: columnをwriting-mode: vertical-lrで代用することができました。

.list03 {
  display: inline-flex;
  flex-wrap: wrap;
  writing-mode: vertical-lr;
}
ul li {
  writing-mode: horizontal-tb;
}

最後にulのwriting-mode: vertical-lrをwriting-mode: vertical-rlに変更します。liが右から左（rl）に折り返し、flex-direction: columnで起きたようなバグは発生しません。rlはright to leftの略です。

ul {
  display: inline-flex;
  flex-wrap: wrap;
  writing-mode: vertical-rl;
}
ul li {
  writing-mode: horizontal-tb;
}