Second column is the tallest instead of the first one when using column-count

Question

The second column seems to be filled first/to be the tallest, at least on certain screen sizes (as seen here). How can I make sure the first column is filled in first and and the second column last (as it would make sense in the English language, reading from left to right)?

Note: I cannot use a set height in this case.

<ul class="list--underline-large">
    <li>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s.</li>
    <li>When an unknown printer took a galley of type and scrambled it to make a type specimen book.</li>
    <li>When an unknown printer took a galley of type and scrambled it to make a type specimen book.</li>
    <li>When an unknown printer took a galley of type and scrambled it to make a type specimen book.</li>
    <li>When an unknown printer took a galley of type and scrambled it to make a type specimen book.</li>
    <li>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s.</li>
    <li>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s.</li>
    <li>When an unknown printer took a galley of type and scrambled it to make a type specimen book.</li>
    <li>It to make a type specimen book.</li>
    <li>It to make a type specimen book.</li>
    <li>It to make a type specimen book.</li>
</ul>

.list--underline-large {
    column-count: 2;
    column-gap: 80px;
    break-inside: avoid-column;
    page-break-inside: avoid;
}

.list--underline-large li {
    border-bottom: 1px solid #143b38;
    display: inline-block;
    margin-bottom: 30px;
    padding: 0 0 30px 0;
    width: 100%;
}

.list--underline-large {
  column-count: 2;
  column-gap: 80px;
  break-inside: avoid-column;
  page-break-inside: avoid;
}

.list--underline-large li {
  border-bottom: 1px solid #143b38;
  display: inline-block;
  margin-bottom: 30px;
  padding: 0 0 30px 0;
  width: 100%;
}

<ul class="list--underline-large">
  <li>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s.</li>
  <li>When an unknown printer took a galley of type and scrambled it to make a type specimen book.</li>
  <li>When an unknown printer took a galley of type and scrambled it to make a type specimen book.</li>
  <li>When an unknown printer took a galley of type and scrambled it to make a type specimen book.</li>
  <li>When an unknown printer took a galley of type and scrambled it to make a type specimen book.</li>
  <li>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s.</li>
  <li>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s.</li>
  <li>When an unknown printer took a galley of type and scrambled it to make a type specimen book.</li>
  <li>It to make a type specimen book.</li>
  <li>It to make a type specimen book.</li>
  <li>It to make a type specimen book.</li>
</ul>