how to set the height of a list of cards to 100%?

Question

I have a list of grid cards, but I can’t set their height, help me please

It doesn’t work to set the height of the list of cards, although I also set the height of the parent element

    <div class="desc-grid__body cards-grid">
      <ul class="cards-grid__list">
        <li class="cards-grid__item">
          <div class="cards-grid__short-card short-card">
            <p class="short-card__content">
              <span class="short-card__lable">Более</span>
              <span class="short-card__title">16 лет</span>
              <span class="short-card__desc">экспертизы</span>
            </p>
          </div>
        </li>
        <li class="cards-grid__item">
          <div class="cards-grid__short-card short-card">
            <p class="short-card__content">
              <span class="short-card__lable">Более</span>
              <span class="short-card__title">10 000</span>
              <span class="short-card__desc">заявок ежедневно
              </span>
            </p>
          </div>
        </li>
        <li class="cards-grid__item ">
          <div class="cards-grid__short-card short-card">
            <p class="short-card__content">
              <span class="short-card__lable">Более</span>
              <span class="short-card__title">1 000</span>
              <span class="short-card__desc">Компетентных специалистов</span>
            </p>
          </div>
        </li>
        <li class="cards-grid__item">
          <div class="cards-grid__short-card short-card">
            <p class="short-card__content">
              <span class="short-card__lable">Более</span>
              <span class="short-card__title">24 / 7 / 365</span>
              <span class="short-card__desc">управления сервисными работами</span>
            </p>
          </div>
        </li>
      </ul>
    </div>

Answer 1

Have you tried to give height to the .cards-grid__item?

It works simply adding .cards-grid__item { height: 100px; background:red;}

.cards-grid__item { height: 100px; background:red;}

 <div class="desc-grid__body cards-grid">
      <ul class="cards-grid__list">
        <li class="cards-grid__item">
          <div class="cards-grid__short-card short-card">
            <p class="short-card__content">
              <span class="short-card__lable">Более</span>
              <span class="short-card__title">16 лет</span>
              <span class="short-card__desc">экспертизы</span>
            </p>
          </div>
        </li>
        <li class="cards-grid__item">
          <div class="cards-grid__short-card short-card">
            <p class="short-card__content">
              <span class="short-card__lable">Более</span>
              <span class="short-card__title">10 000</span>
              <span class="short-card__desc">заявок ежедневно
              </span>
            </p>
          </div>
        </li>
        <li class="cards-grid__item ">
          <div class="cards-grid__short-card short-card">
            <p class="short-card__content">
              <span class="short-card__lable">Более</span>
              <span class="short-card__title">1 000</span>
              <span class="short-card__desc">Компетентных специалистов</span>
            </p>
          </div>
        </li>
        <li class="cards-grid__item">
          <div class="cards-grid__short-card short-card">
            <p class="short-card__content">
              <span class="short-card__lable">Более</span>
              <span class="short-card__title">24 / 7 / 365</span>
              <span class="short-card__desc">управления сервисными работами</span>
            </p>
          </div>
        </li>
      </ul>
    </div>

Hope you got the something you want..

Thanks...

Answer 2

You can set height in "li" tag, Also as per your code you can set in .cards-grid__list class.