Почему не работает явный height в пикселях для блочного элемента?

Question

Ситуация максимально простая: есть блок, внутри него контейнер, внутри контейнера еще один див. Явная высота в пикселях задана только самому младшему диву.В результате высота у всех блоков равна высоте текста внутри. Может быть глупый вопрос, но я в упор не понимаю в чем дело.

.titleWletter {
  max-width: 100%;
  margin: 0 auto;
  height: 180px;
}

<section class="main__blog blog">
  <div class="blog__container">
    <div class="blog__titleWletter titleWletter">
      <h3 class="titleWletter__title">
        Let's blog
      </h3>
    </div>
  </div>
</section>

Answer 1

Всё работает:

.titleWletter {
  max-width: 100%;
  margin: 0 auto;
  height: 180px;
  outline: 1px dotted red;
}

<section class="main__blog blog">
  <div class="blog__container">
    <div class="blog__titleWletter titleWletter">
      <h3 class="titleWletter__title">
        Let's blog
      </h3>
    </div>
  </div>
</section>

БЛОГ НА HUSL

Почему не работает явный height в пикселях для блочного элемента?

Ответы (1 шт):