Переполнение дочернего элемента div внутри parent расширяет родительский элемент

У меня есть эта проблема с div для комментариев, переполняющих его родителя.. Я пробовал пару вариантов в CSS, но безуспешно.

пример

<div class="col-md-8 depos>
  <div class="col-md-7 depo-cont>
    <div class="depo">
      <h5>Marcio</h5>
      <p>Vou de novo</p>
    </div>
  </div>
 <div class="col-md-5">Form here</div>
</div>

Основная проблема - попытка переполнения: "depo-cont" div расширяет нижнюю часть родительского элемента. Любые идеи о том, как справиться с этим?

Источник

2 ответа

Решение

Исправлена ​​ошибка, при которой максимальная высота дочернего элемента совпадала с родительской (что, естественно, приводит к переполнению, когда содержимое превышает размер).

.depo-cont{
max-height:500px;
overflow:scroll;}

фиксировать

Источник

Если цель состоит в том, чтобы иметь фиксированную высоту на .depos контейнер, тогда вы можете сказать ему, чтобы прокрутить его содержимое, когда он становится слишком высоким:

.depos {overflow: scroll;}

Простая демонстрация:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<style>

.outer {height: 200px; width: 100px; overflow: scroll;}

</style>
</head>
<body>

<div class="outer">
    <div>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Necessitatibus, et, officiis, molestiae, ea veniam esse nam enim eaque ad tenetur cum incidunt consectetur iste ullam eos veritatis cupiditate tempora consequatur. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Necessitatibus, et, officiis, molestiae, ea veniam esse nam enim eaque ad tenetur cum incidunt consectetur iste ullam eos veritatis cupiditate tempora consequatur. Lorem ipsum dolor sit amet, consectetur adipisicing elit.</div>
</div>

</body>
</html>
Источник
Другие вопросы по тегам