从顶部对齐li项

Question

我正在尝试从顶部对齐li项目，以使它们看起来像这样：

但是，用我当前的代码，我不确定为什么我的列表会像这样...

.customer-experience .list-items {
  padding-top: 110px;
  box-sizing: border-box;
  list-style: none;
}

.customer-experience .list-items li {
  width: 33%;
  float: left;
}

.customer-experience .list-items li h3 {
  font-size: 90px;
  color: #333333;
  font-family: "Oswald";
  font-weight: 400;
  margin-bottom: 0;
  padding-bottom: 50px;
  border: 1px solid red;
}

.customer-experience .list-items li p {
  color: #333333;
  font-weight: 400;
  font-size: 1.875rem;
}

<section class="text-block customer-experience">
  <div class="wrapper">
    <div class="content-block">
      <div class="content-block-wrapper">
        <ul class="list-items">
          <li>
            <h3>64%</h3>
            <p>Customers want personalised offers</p>
          </li>
          <li>
            <p>Up to</p>
            <h3>€20 million</h3>
            <p>Fine for GDPR non-compliance</p>
          </li>
          <li>
            <h3>52%</h3>
            <p>Customers say not enough is done to make them feel welcome</p>
          </li>
        </ul>
      </div>
    </div>
  </div>
</section>

我试图添加一个固定的高度，但是1.我不想添加固定的高度； 2。仍然不管用。第二个列表项上方还有一个<p>，这可能是导致问题的原因吗？想法？