「Flexible Box」の一つだけを横幅一杯に表示するためには、「width:100%;」＋ 改行指定

デザイン仕様

1行目
・「Flexible Box」の一つだけを横幅一杯に表示

2行目
・「Flexible Box」の残りを横並び表示

---

コーディング例

▼HTML

<div class="flexdiv">

  <img>

  <h4></h4>

  <p></p>

</div>

▼CSS

.flexdiv{

  display:flex;

  flex-flow: wrap; /*折り返しを許可、「複数行」*/

}

.flexdiv h4 {

  order:1;

  width:100%;

}

.flexdiv img {

  order:2;

}

.flexdiv p {

  order:3;

  width:70%;

}

---

!

CSS仕様に準拠しているかどうかは不明
・うまくいっているように見えているだけかも