Чтобы создать белый блок слева с помощью CSS, вы можете использовать несколько методов. Вот некоторые из них:

Метод 1: использование свойства CSS Float
HTML:

<div class="white-block"></div>

CSS:

.white-block {
  float: left;
  width: 100px; /* Adjust the width as needed */
  height: 200px; /* Adjust the height as needed */
  background-color: white;
}

Метод 2: использование CSS-позиционирования
HTML:

<div class="container">
  <div class="white-block"></div>
</div>

CSS:

.container {
  position: relative;
}
.white-block {
  position: absolute;
  left: 0;
  top: 0;
  width: 100px; /* Adjust the width as needed */
  height: 200px; /* Adjust the height as needed */
  background-color: white;
}

Метод 3: использование CSS Flexbox
HTML:

<div class="container">
  <div class="white-block"></div>
  <div class="content">
    <!-- Your content here -->
  </div>
</div>

CSS:

.container {
  display: flex;
}
.white-block {
  width: 100px; /* Adjust the width as needed */
  height: 200px; /* Adjust the height as needed */
  background-color: white;
}
.content {
  flex-grow: 1;
  /* Additional styles for the content area */
}

Метод 4. Использование CSS Grid
HTML:

<div class="container">
  <div class="white-block"></div>
  <div class="content">
    <!-- Your content here -->
  </div>
</div>

CSS:

.container {
  display: grid;
  grid-template-columns: 100px 1fr; /* Adjust the column sizes as needed */
}
.white-block {
  background-color: white;
}
.content {
  /* Additional styles for the content area */
}