уменьшите стиль списка, чтобы он соответствовал тексту css

Question

Я пытаюсь изменить стиль элемента списка, чтобы он соответствовал остальной части текста (например, размер шрифта и т. Д.), Но я не могу изменить его вообще.

код, что список создается путем является:

%ol.question-parts 
    - test_question.answers.each do |answer| 
     %li.question-text 
     %div.question-part-description 
      %p=change_math_delims(answer.question_part.description) 

код у меня есть на данный момент, чтобы показать список является:

ol { 
    list-style-type: lower-alpha; 
    list-style-position: outside; 
    margin: 0; 
    padding: 0; 
} 

li { 
    display: list-item; 
    padding: 1px 1px 1px 1px; 
} 

, но я хочу, чтобы целевой размер нижний альфа стиль списка ... на данный момент он появляется как это:

любые идеи?

Answer 1

Я не уверен, как ваш текст и список могут быть раздельными. Вы создаете список в своем HTML, например:?

<ol> 
    <li>Coffee</li> 
    <li>Tea</li> 
    <li>Milk</li> 
</ol> 

JS Fiddle here

Answer 2

Я не знаю, если это то, что вы хотите без кода

Я content:counter на lipseudo-element

ol{ 
 
    list-style:none; 
 
} 
 

 
li:before{ 
 
    content: counter(list, lower-alpha)"."; 
 
    counter-increment: list; 
 
    font-size:30px; 
 
}

<ol> 
 
    <li>Text</li> 
 
    <li>Text</li> 
 
    <li>Text</li> 
 
    <li>Text</li> 
 
    <li>Text</li> 
 
    <li>Text</li> 
 
    <li>Text</li> 
 
</ol>