0

Есть блок с заданной высотой(250px) и нужно чтоб высота блока менялась при адаптивке на 450px, но при указании этой высоты не влезают остальные блоки туда. Что указать блокам, чтоб они вмещались в блок?

.stn-numbers {
  padding-top: 65px;
  padding-left: 95px;
  background: @bg-black;
  min-height: 250px;
  width: 100%;
  color: #bbbbbb;
  font-weight: 600;
  h3 p {
    font-size: 16px;
    height: 40px;
  }
}

@media (max-width: 992px) {
  .stn-numbers {
    padding-bottom: 45px;
    text-align: center;
    max-height: 320px;
    overflow: hidden;
    width: 50%;
  }
}
<section class="stn-numbers" id="projects">
  <div class="container">
    <div class="row">
      <div class="col-md-6 col-lg-3 sprite ">
        <div class="sprite-star"></div>
        <h3>612</h3>
        <p>POSITIVE FEEDBACKS</p>
      </div>
      <div class="col-md-6 col-lg-3 sprite">
        <div class="sprite-clock"></div>
        <h3>1465</h3>
        <p>WORKING HOURS</p>
      </div>
      <div class="col-md-6 col-lg-3 sprite">
        <div class="sprite-container"></div>
        <h3>548</h3>
        <p>PROJECTS COMPLETED</p>
      </div>
      <div class="col-md-6 col-lg-3 sprite">
        <div class="sprite-heart"></div>
        <h3>735</h3>
        <p>HAPPY CLIENTS</p>
      </div>
    </div>
  </div>
</section>

1 ответ 1

1

попробуйте задать высоту относительно высоты екрана

height: 100vh

а свои блоки сделайте margin так чтоб они были поцентру это отступ отверха 50vh - половина высоты блока который должен быть по центру

или же посмотрите в сторону flex

display: flex;
justify-content: center;
flex-wrap: wrap;
align-items: center;

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge you have read our privacy policy.

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