Flexboxでwrapとbetweenとstartを併用させたい
やりたいこと
2行以上ありうるのでflex-wrapする
paddingを均等に分けたいので、space-betweenしたい
2行目以降も左揃えにしたい
>#WIP
タイトルが変
こんなふうにしたい
画像はこのPlaygroundのスクショ
1つ1つのItem widthは19%にしている
cssflex-wrap: wrap;
justify-content: space-between;
cssflex-wrap: wrap;
justify-content: flex-start;1段目の右に隙間ができてしまう
こんなふうにしたい
css.container {
display:flex;
flex-wrap: wrap;
justify-content: normal;
}
.item {
width: 15.8%;
margin: 0 1.5% 10px;
flex-basis: 17%;
}flex-basisで横幅を指定している
このケースでは画像なのでwidthが決まっているため
space-between を使わなくても良い感じになっているように見えるたまたまいけてるだけなのか、汎用的にできるものなのかわかっていない #??
ちゃんと見ていない
flexの指定だけでどうにかできないものか
これでも良い気もする