Вертикальное выравнивание элемента списка CSS

Question

Сегодня я столкнулся с проблемой CSS, которую я никогда раньше не видел:

Это два отдельных упорядоченных списка. а во втором списке номер 1 выровнен по нижней части маркера, а не по верху, что является единственным способом, который я когда-либо видел (и именно это я и хочу).

Код для этих двух списков идентичен, за исключением того, что у первого нет тега привязки, а у второго:

Это часть поста на сайте WordPress, и основной файл CSS для этой темы, если он не минимизирован, имеет длину в тысячи строк и, следовательно, несколько ошеломляет меня.

Поскольку я никогда не видел обозначения, отформатированные таким образом, и даже не подозревал, что это можно сделать, кто-нибудь может подсказать мне, какую функцию CSS я должен искать в файле CSS, чтобы я мог выровнять число сверху? к связанному тексту?

Спасибо!

==========

UPDATE:

Я думаю, что это блок CSS, который контролирует это форматирование:

body.single .single-inner-wrapper article#single-article .entry-content a {
    color: #41b5f9;
    position: relative;
    line-height: 1.2;
    display: inline-block;
    z-index: 1
}

Спасибо за предложение от G-Cyr, я добавил вертикальное выравнивание: сверху к этому разделу, и, похоже, что число во втором списке переместилось с выравнивания снизу вверх по выравниванию сверху. где я хочу.

Спасибо всем, кто помог!

Answer 1

С MDN :

Счетчики CSS позволяют настроить внешний вид содержимого в зависимости от его местоположения в документе.

Вот краткийпример, показывающий, как это будет использоваться.

• Установить значение по умолчанию list-style на none
• Всегда сбрасывать счетчик в родительском элементе
• Увеличивать номер счетчикав каждом li
• Убедитесь, что li относительно расположен
• Сохраните фактическое число плюс "."в псевдоэлементе content
• Показывать только цифры для li с непустыми
• Стиль по своему вкусу

.my-list {
  counter-reset: my-list-title;
  list-style: none;
  max-width: 400px;
}

.my-list li {
  counter-increment: my-list-title;
  position: relative;
}

.my-list li:not(:empty)::before {
  content: counter(my-list-title) ".";
  position: absolute;
  bottom: 0;
  left: -1.2em;
}

<ol class="my-list">
  <li>xxxx xxxx xxxxxxx xxxxxx xxxxx xxxxx xxxxxxx xxxxxx xxxxx xxxxx</li>
  <li>xxxx xxxx xxxxxxx xxxxxx</li>  
</ol>

jsFiddle

Answer 2

Я думаю, что это блок CSS, который контролирует это форматирование:

body.single .single-inner-wrapper article#single-article .entry-content a {
    color: #41b5f9;
    position: relative;
    line-height: 1.2;
    display: inline-block;
    z-index: 1
}

Спасибо за предложение от G-Cyr, я добавил вертикальное выравнивание: верхняя часть этого раздела, и кажется, чтопереместили число во втором списке с выравнивания снизу вверх.где я хочу.

Спасибо всем, кто помог!