Html ordered list ol, add space between number and text

Question

I want to add a space between the number of ordered list and text

ex:

 1.     Hello.
 2.     Test.

Space between "1." and "Hello" needs to be increased.

Note. I use the style below because I don't want to. to start with the leftmost

    ol
    {
        word-break: break-all;
    }
    li
    {       
        list-style-position: inside;
        padding: 0;
    }

I want exactly the same as below, im to get everything except a space between the list numbering and the text (marked in the image)

Answer 1

Please note that you have in .li li

ol {
  word-break: break-all;
  margin: 0;
  padding: 0;
}
ol ol {
    margin-left: 2em;
}
li {
  list-style-position: inside;
  padding: 0;
}
li::before {
  content: "";
  width: 20px;
  display: inline-block;
}

<ol>
  <li>Hello. Hello. Hello. Hello. Hello. Hello. Hello. Hello. Hello. Hello. Hello. Hello. Hello. Hello. Hello. Hello. Hello. Hello. Hello. Hello. Hello. Hello. Hello. Hello. Hello. Hello. Hello. Hello. Hello. Hello. Hello. Hello. Hello. Hello. Hello. Hello.
    Hello. Hello. Hello. Hello. Hello. Hello. Hello. Hello. Hello. Hello. Hello. Hello. Hello. Hello. Hello.</li>
  <li>Test.</li>
  <ol>
    <li>Hello.Hello. Hello. Hello. Hello. Hello. Hello. Hello. Hello. Hello. Hello. Hello. Hello. Hello. Hello. Hello. Hello. Hello. Hello. Hello. Hello.</li>
    <li>Test.</li>
  </ol>
</ol>

Run codeHide result

Answer 2

You can specify a space using this code.

<ol style="padding-left:1em">
    <li style="padding-left:1em">Some text</li>
</ol>

Answer 3

Try adding padding-left: 25px; to li