Edited at

【CSS】flexboxにjustify-selfは効かない


中央寄せしているflex itemの中で、特定のものだけ端に寄せたい

align-self と同じ要領で、flex containerに justify-content: center; 設定しておいて、端に寄せたいflex itemに justify-self を設定すればいけるかな?と思ったら効かなかった。



See the Pen

EzXeaw
by mishiwata1015 (@mishiwata1015)

on CodePen.


どうやら、flexboxにjustify-selfは効かないとのこと。

端に寄せたいflex itemに、 margin-left: auto;margin-right: auto; を設定して解決。


See the Pen
pmrVBP
by mishiwata1015 (@mishiwata1015)
on CodePen.