前提条件

• Windows10のIE11
• iOS13のSafari（iPad第6世代とiPhoneSE2020）

目的

• flexで列の順番を逆順にする。

手順

• 以下のCSSを設定

<divid="flex-box"><divclass="col">1</div><divclass="col">2</div></div>

#flex-box{display:flex;flex-direction:column-reverse;}

現象

• 高さがなくなり、コンテンツが重なる。

対応

• 以下の設定を列要素に設定。

.col{flex:11auto;}

備考

• PC・Android版のChrome、Chromium版のEdge、古いMacのSafariでは、対応コードなく期待通りの結果になる。
• iOSのSafari　は、「スマホ界のIE」と呼べるぐらい独特な仕様だが、シェアがあるため無視できない。この件については、本当にIE11と同じ挙動になっていた。