Полная ширина 2 столбца изображения и текста Раздел css сетка

Question

Привет всем, я новичок в сетке css. Кто-нибудь, пожалуйста, помогите мне. Я пытаюсь создать раздел изображения и текста в колонке Fullwidth 2, который я пытался найти на YouTube, но не могу, просто приведите пример и css, пожалуйста Заранее спасибо.

Как то так

Answer 1

Как упоминалось ранее, если бы это было только для этого простого макета, то flexbox был бы хорошим решением.

Поскольку вы просили сеточное решение css, вот вам go:

.container {
  display: grid;
  grid-template-columns: 1fr 1fr;
}

.column {
  background-color: red;
  height: 300px;
}

.column:nth-child(2) {
  background-color: yellow;
}

<div class="container">
  <div class="column">image</div>
  <div class="column">text</div>
</div>

Answer 2

Если вы не хотите использовать какой-либо css фреймворк.
Html:

<div class="container">
  <div class="col">image</div>
  <div class="col">content</div>
</div>

Css:

.container {
  display: flex;
}

.col {
  flex: 1;
  background-color: red;
  height: 400px;
}

.col:nth-child(2) {
  background-color: yellow;
}

Так просто:).