Центрирование маркированного списка с помощью flexbox

Question

У меня есть список внутри раздела.Я хочу центрировать список так, чтобы пули располагались вертикально.Как мне это сделать с flexbox?

Удаление flex-direction: column и text-align:center - это не ответ, так как они нужны мне для другого содержимого страницы.

.text-list{
  display: flex;
  justify-content: center;
  flex-direction: column;
  text-align:center;
}

ul{
  list-style-type:disc;
}

<section class="text-list">
<ul>
<li>short</li>
<li>and very long line</li>
<li>shorter line</li>
</ul>
</section>

Answer 1

Попробуйте использовать это

.text-list{
    display:flex;
    justify-content:center;
}

ul{
    min-width:auto;
    display: flex;
    justify-content:flex-start;
    flex-direction:column;
}



<section class="text-list">
    <ul>
        <li>short</li>
        <li>and very long line</li>
        <li>shorter line</li>
    </ul>
</section>

Answer 2

Это можно сделать, просто добавьте этот CSS к вашему ul

ul {display: table;поле: 0 авто;}

    ul {
      display:table;
      margin:0 auto;
    }
    .text-list {
      display: flex;
      justify-content: center;
      flex-direction: column;
      text-align:center;
    }    
    ul {
      list-style-type:disc;
    }

<section class="text-list">
  <ul>
    <li>short</li>
    <li>and very long line</li>
    <li>shorter line</li>
  </ul>
</section>

Answer 3

Попробуйте центрировать text-list, используя display:flex; и align-items: center;;)

Answer 4

Обновление Спасибо @Akash Pandey ul margin: автоматическое предложение
Можете ли вы попробовать это пример также см. Ниже

.text-list{
   display: flex;
   justify-content: left;
   flex-direction: column;
   text-align:left;
 }

ul{
  list-style-type:disc;
  margin: auto;
}