Как выровнять p под h3, сохраняя при этом номер и h3 в одной строке с помощью Tailwind? ⇐ CSS

[Anonymous]

Я работаю над проектом, в котором мне нужно разместить три элемента:
Число внутри красного круга.
Заголовок выровнен по той же строке, что и число. .
Элемент , начинающийся непосредственно под заголовком.
вот мой код:

Код: Выделить всё

01


Track company wide progress



Lorem ipsum dolor sit amet consectetur adipisicing elit. Officiis
voluptatibus ea ab ullam esse animi vel eius sint laboriosam natus
et ex accusamus, at ipsa voluptates! Voluptatem illum molestias eaque!

В настоящее время число и h3 расположены правильно, но элемент p начинается слишком далеко влево.
Как я могу сделать так, чтобы элемент p начинался именно там, где начинается h3?
p>
Вот ссылка на проект:
текст
скриншот
Я попробовал следующие подходы для выравнивания элемент p под h3 правильно:
Добавление отступов или полей: я использовал такие классы, как pl-12 и ml-4, чтобы сместить элемент p.
Обтекание родительским элементом Div: я добавил дополнительный элемент div для группировки элементов h3 и p и применил классы пробелов к элементу div.
Настройка классов в контейнерах Выше: я попытался изменить пробелы-x-2 и items-center в контейнере, обертывая число и h3.
Несмотря на в этих попытках элемент p неправильно выравнивается под h3. Я ожидаю, что текст p будет начинаться точно там, где начинается текст h3, сохраняя при этом макет нетронутым.

Подробнее здесь: https://stackoverflow.com/questions/793 ... ing-tailwi