Как выравнить элементы в grid?

Question

[San Manjiro]

У меня есть div элементы:

<div class="table_double_clm">
  <div class="li_block">
    <p class="lib_left">№ Договора</p>
    <p class="lib_right">999999999999</p>
  </div>
  <div class="li_block">
    <p class="lib_left">Дата выдачи займа</p>
    <p class="lib_right">24.03.2012</p>
  </div>
  <div class="li_block">
    <p class="lib_left">Сумма займа</p>
    <p class="lib_right">3 000 ₽</p>
  </div>
  <div class="li_block">
    <p class="lib_left">Срок займа</p>
    <p class="lib_right">21 дней</p>
  </div>
  <div class="li_block">
    <p class="lib_left">Необходимо погасить</p>
    <p class="lib_right">14.04.2012</p>
  </div>
  <div class="li_block">
    <p class="lib_left">Сумма оплаты</p>
    <p class="lib_right">3 570.00 ₽</p>
  </div>
  <div class="li_block">
    <p class="lib_left">Срок пользования займом</p>
    <p class="lib_right">20 дней</p>
  </div>
  <div class="li_block">
    <p class="lib_left">Оплачено</p>
    <p class="lib_right">0.00 ₽</p>
  </div>
  <div class="li_block">
    <p class="lib_left">Статус займа</p>
    <p class="lib_right">
      Займ выдан
    </p>
  </div>
</div>

Я выравнил это так:

.li_block {
    display: grid;
    grid-template-columns: auto 1fr;
    justify-items: end;
}

Проблема в том, что элементы справа не выравниваются в линию. Нужно чтобы они прижались к правому краю, но выравнились по красной линии:

Comments

[Ankhena]

Знаете, если заменить разметку на dl, <dt> и <dd>, то даже вопроса такого бы не возникло. Они бы элементарно выстроились гридом без танцев.

Answer 1

[HARDOOPS]

Используйте flex, он ничем не хуже.

.li_block {
    display: flex;
    justify-content: space-between;
}

UPD: если принципиально grid.

.li_block {
    display: grid;
    grid-template-columns: auto calc(100% / 3);
    justify-items: stretch;
}

Comments

[San Manjiro]

да через флексы та я знаю как, мне имнно грид нужен )

[HARDOOPS]

San Manjiro, я правильно понял, что у всех .lib_right должна быть одинаковая ширина?

[San Manjiro]

HARDOOPS, да

[HARDOOPS]

Так хотите?

.li_block {
    display: grid;
    grid-template-columns: auto calc(100% / 3);
    justify-items: stretch;
}

[San Manjiro]

HARDOOPS, да, это то что надо было, спасибо большое )