0

Как задать блоку .block высоту, равную высоте всего контента(body)?
Высота всего контента не известа, возможно ли это как-то сделать без js?
Я могу сделать position: fixed для .block и высоту 100% или 100vh и будет почти тот же эффект, но мне интересно, есть ли такое свойство/хак вообще

.block {
  background: green;
  position: absolute;
  width: 100px;
  height: 100%;
}

.block__1 {
  background: black;
  width: 100%;
  height: 600px;
}

.block__2 {
  width: 100%;
  height: 500vh;
  background: red;
}
<body>
  <div class=".container">
    <div class="block"></div>
    <div class="block__1"></div>
    <div class="block__2"></div>
  </div>
</body>

1
  • не делать блок абсолютным?)
    – Yamich
    12 дек 2019 в 9:19

1 ответ 1

2

Возможно, это то что вам нужно?

.container {
  position: relative;
  overflow: hidden;
}

.block {
  background: green;
  position: absolute;
  bottom: 0;
  top: 0;
  left: 0;
  width: 100px;
  min-height: 100%;
}

.block__1 {
  background: black;
  width: 100%;
  height: 600px;
}

.block__2 {
  width: 100%;
  height: 500vh;
  background: red;
}
<body>
  <div class="container">
    <div class="block">
    </div>
    <div class="block__1">
    </div>
    <div class="block__2">
    </div>
  </div>
</body>

Ваш ответ

Нажимая на кнопку «Отправить ответ», вы соглашаетесь с нашими условиями использования и подтверждаете, что прочитали и поняли наши политику конфиденциальности и нормы поведения.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.