Flexbox「justify-content」で最後の行を左寄せにする方法

2023-1-25

Flexboxのjustify-contentで「center」を指定すると、最後の行も中央寄せになってしまうので、それを左寄せにする方法です。

3カラムの場合

.container::after{
  content:"";
  display: block;
  width:30%;
}

4カラムの場合

.container::before{
  content:"";
  display: block;
  width:23%;
  order:1;
}
.container::after{
  content:"";
  display: block;
  width:23%;
}

5カラム以上は厳しいそうですね。。。

WORKS