Как сделать статистику в css?

Question

[OblivionGM]

На шаблоне есть вот такая статистика (см.фото), и значения по правой стороне выровнялись по уровню.
Как подобное реализовать в css? margin и padding думаю не подойдет, так как текст может изменяться и соответственно все полетит, а если разбить на два div'а и выровнять, то нет никакой привязки к друг-другу, может спрыгнуть тоже, думаю. Как посоветуете сделать, какой подход к таким вещам правильный?

P.S. Только обучаюсь, понимаю, что некоторые моменты в вопросе могут звучать глупо. Красными линиями пометил расстояние.

Comments

[Ankhena]

Обычные гриды
https://jsfiddle.net/yrzn1xak/

[OblivionGM]

Ankhena, уже разобрался благодаря Вашей ссылке и дополнительной информацией в гугле, спасибо! :)

Answer 1

[SotickYoker]

<ul class="wrap">
  <li>
    <p>Учеников:</p>
    <p>290</p>
  </li>
  <li>
    <p>Успешно закончили курс:</p>
    <p>190</p>
  </li>
</ul>

ul{
  list-style-type: none;
  width: 50%;
  background: #000;
  margin: 0;
  padding: 10px;
}

li{
  display: flex;
  justify-content: space-between; 
  color: #fff;
}

Вот хорошая статейка - пригодится:
https://tpverstak.ru/flex-cheatsheet/