Jak zachować wcięcie dla drugiej linii na zamówionych listach za pomocą CSS?

Chcę mieć listę „wewnątrz” z listami punktowymi lub liczbami dziesiętnymi, które wszystkie są wyrównane z wysokimi blokami tekstu. Drugie wiersze wpisów listy muszą mieć takie samo wcięcie jak pierwszy wiersz!

Na przykład.:

<code>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. 
Aenean commodo ligula eget dolor. Aenean Aenean massa. 
Cum sociis natoque penatibus et magnis dis parturient montes, 
nascetur ridiculus mus. Donec quam felis,

1. Text
2. Text
3. longer Text, longer Text, longer Text, longer Text, longer Text, longer Text
   second line of longer Text
4. Text

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. 
Aenean commodo ligula eget dolor. 
</code>

CSS zapewnia tylko dwie wartości dla „pozycji-stylu-listy” - wewnątrz i na zewnątrz. W przypadku „wewnątrz” drugie linie są wyrównane z punktami listy, a nie z linią nadrzędną:

<code>3. longer Text, longer Text, longer Text, longer Text, longer Text, longer Text
second line of longer Text
4. Text
</code>

Szerokość „na zewnątrz” moja lista nie jest już wyrównana z lepszymi blokami tekstu.

Eksperymenty mają szerokość wcięcia tekstu, dopełnienie-lewe i lewe marginesy działają dla list nieuporządkowanych, ale nie działają w przypadku list uporządkowanych, ponieważ zależy to od liczby znaków dziesiętnych w liście:

<code> Lorem ipsum dolor sit amet, consectetuer adipiscing elit. 
 Aenean commodo ligula eget dolor. 

 3. longer Text, longer Text, longer Text, longer Text, longer Text, longer Text
    second line of longer Text
 4. Text
11. Text
12. Text
</code>

„11.” i „12.” nie są wyrównane z wyższym blokiem tekstu w porównaniu z „3.” i „4.”.

Więc gdzie jest sekret o uporządkowanych listach i wcięciu w drugiej linii? Dzięki za twój wysiłek!

questionAnswers(14)

yourAnswerToTheQuestion