Блог

Решено!
Я установил поле равным 0 (вместо 0 auto) и добавил отступ слева для каждого отдельного li в моем упорядоченном списке type = «a».

Первоначальный вопрос
У меня есть список пронумерованных маркированных точек с маркированными точками типа a (например, a, b, c) следующим образом:

text.html

 <div class="content-section">
  <ol> 
    <li>this is a sample text that stretches across the page
       and it takes up the second line</li>
    <ol type="a"> 
      <li>this is a sample text that stretches across the page</li>
      <li>this is a sample text that stretches across the page</li>
      <li>this is a sample text that stretches across the page</li>
    </ol>
    <li>this is a sample text that stretches across the page
        and it takes up the second line</li>
    <ol type="a"> 
       <li>this is a sample text that stretches across the page</li>
       <li>this is a sample text that stretches across the page</li>
       <li>this is a sample text that stretches across the page</li>
     </ol>
   <ol>
<div>
  

text.css

 .content-section {
  p,
  li {
    max-width: 900px;
    text-align: justify;
    margin: 0 auto;
    color: $color-hint;
  }
}
  

Как это выглядит:

 1) this is a sample text that stretches across the page
   and it takes up the second line
   a. this is a sample text that stretches across the page
   b. this is a sample text that stretches across the page
   c. this is a sample text that stretches across the page
2) this is a sample text that stretches across the page
   and it takes up the second line
   a. this is a sample text that stretches across the page
   b. this is a sample text that stretches across the page
   c. this is a sample text that stretches across the page
  

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

Есть идеи о том, как я могу это сделать? Я попытался настроить отступы и поля, но это не работает

Я бы сделал это с помощью HTML

 <p>1) This is sample Text</p>
<ol type = "a" id = "bullet">
  <li>Sample Text</li>
  <li>Sample Text</li>
  <li>Sample Text</li>
</ol>
<p>2) This is sample text</p>
<ol type = "a" id = "bullet">
  <li>Sample Text</li>
  <li>Sample Text</li>
  <li>Sample Text</li>
</ol>
  

Затем добавьте это в CSS

 #bullet{
left:10px;
}
  

Может не понадобиться CSS, так как списки автоматически делают отступы