フレックスボックス 練習問題-回答

解答例 1:

.container {
        display: flex;
        justify-content: center;
        align-items: center;
}

解答例 2:

.container {
      display: flex;
      flex-direction: column;
      justify-content: flex-end;
}

解答例 3:

.container {
  display: flex;
  justify-content: space-between;
}

解答例 4: 個別アイテムの拡張

.container {
 display: flex;
}

.item-2 {
 flex: 1; 
}

解答例 5:

.container {
        display: flex;
        gap: 10px;
}