Позиционирование блоков во flex

Question

Не получается нарисовать правый блок. Блоки слева нарисованы, а справа (сбоку от него) не могу нарисовать.

main {
  display: flex;
}

.left_part {
  display: flex;
  flex-direction: column;
  width: 65%;
}

.left_top {
  height: 350px;
  background-color: green;
}

.left_bottom {
  height: 350px;
  background-color: greenyellow;
}

.right_part {
  display: flex;
  width: 35%;
}

.right_side {
  background-color: black;
  height: 700px;
}

<main class="main">

  <div class="left_part">
    <div class="left_top"></div>
    <div class="left_bottom"></div>
  </div>

  <div class="right_part">
    <div class="right_side"></div>
  </div>
  
</main>

В чём моя ошибка и как её решить?

Answer 1

flex-direction: column; тогда и для правого блока надо выставить!

main {
  display: flex;
}

.left_part {
  display: flex;
  flex-direction: column;
  width: 65%;
}

.left_top {
  height: 350px;
  background-color: green;
}

.left_bottom {
  height: 350px;
  background-color: greenyellow;
}

.right_part {
  display: flex;
  flex-direction: column;
  width: 35%;
}

.right_side {
  background-color: black;
  height: 700px;
}

<main class="main">

  <div class="left_part">
    <div class="left_top"></div>
    <div class="left_bottom"></div>
  </div>

  <div class="right_part">
    <div class="right_side"></div>
  </div>
  
</main>

Answer 2

В .right_side надо добавить width: 100%;

БЛОГ НА HUSL

Позиционирование блоков во flex

Ответы (2 шт):