flex box – web memo

SPなどで２カラムなどを左寄せにした場合
justify-content:center;を利用しているときね

&:after{
content:"";
display: block;
width:calc(160 / #{$device_sp} * 100vw);
}

side側を300pxで固定する場合

.wrapper {
  display: -webkit-flex;
  display: flex;
}
.main {
  -webkit-flex: 1;
  flex: 1;
}
.side {
  width: 300px;
}

親プロパティ
display:flex;

flex-wrap: wrap; //小要素改行

縦並びに
flex-direction: column;

横並び（SPの時に戻す場合）

flex-direction: row;

—-

3カラム

.items{
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}
.item{
  width: 32%;
  height: 100px;
  background: #3D9FB1;
}