Как в css сделать 3 колонки

Для создания трех колонок в CSS можно использовать свойство display: flex; и определить ширину или гибкость (flex) каждой колонки. Например:

HTML код:

<div class="wrapper">
  <div class="column col1">Колонка 1</div>
  <div class="column col2">Колонка 2</div>
  <div class="column col3">Колонка 3</div>
</div>

CSS код:

.wrapper {
  display: flex;
}
.col1 {
  flex: 1;
  /* ширина первой колонки занимает 1/3 от всего контейнера */
}
.col2 {
  flex: 1;
  /* ширина второй колонки занимает 1/3 от всего контейнера */
}
.col3 {
  flex: 1;
  /* ширина третьей колонки занимает 1/3 от всего контейнера */
}

Если нужны фиксированные размеры колонок, то можно задать ширину каждой колонки в пикселях или процентах:

.col1 {
  width: 200px;
  /* первая колонка шириной 200 пикселей */
}
.col2 {
  width: 50%;
  /* вторая колонка занимает половину ширины контейнера */
}
.col3 {
  width: calc(100% - 300px);
  /* третья колонка занимает оставшуюся ширину минус ширина первой и второй колонок */
}