Remove indent multi tiered ordered list

Question

I've multi tier list which I want to have the same indent across all tiers, currently as I go into each tier, each tier gets indented more. I want them all to share the same indent level. I've managed to get the css to a level where they are all indented, however I'm getting the problem by where if one line is too long, it runs over the next line. The ability to have a second line seems to have dissapeared.See how it turns out in this image How do I work the code and so that the second line runs on properly and doesn't cover up the first line?

ol,li {
    padding: 0;
    margin:0
    }

ol {
    list-style:none;
    counter-reset: item 
}

li:before {
    content: counters(item, ".") " "; 
    counter-increment: item ;
}

li span{
    position: absolute;
    left: 50px;
}

The HTML code is:

    <ol>
        <li><span> omnis ab quasi voluptatem voluptatem consequuntur sed fugit beeaque totam inventore sed ut sit dolores perspiciatis inventore ipsa totam ipsam ipsam, </span>
            <ol>
                <li><span> omnis ab quasi voluptatem voluptatem consequuntur sed fugit bsam ipsam, perspiciatis sed inventore eaque totam inventore sed ut sit dolores perspiciatis inventore ipsa totam ipsam ipsam, </span>
                </li>
                <li><span> omnis ab quasi voluptatem voluptatem consequuntur sed fugit beatae veritatis sed quperspiciatis inventore ipsa totam ipsam ipsam, </span>
                </li>
                <ol>
                    <li><span> omnis ab quasi voluptatem voluptatem consequuntur sed fugit is ab quasi voluptatem voluptatem consequuntur sed fugit beatae veritatis sed quae dolores iste quasi ipsam ipsam, perspiciatis sed inventore eaque totam inventore sed ut sit dolores perspiciatis inventore ipsa totam ipsam ipsam,</span>
                    </li>
                </ol>
            </ol>
        </li>

        <li><span> omnis ab quasi voluptatem voluptatem consequuntur sed fugitrspiciatis sed inventore eaque totam inventore sed ut sit dolores perspiciatis inventore ipsa totam ipsam ipsam, </span>
        </li>
        <li><span> omnis ab quasi voluptatem voluptatem consequuntur sed fugit beatae ve totam inventore sed ut sit dolores perspiciatis inventore ipsa totam ipsam ipsam, </span>
        </li>
    </ol>

Answer 1

Something like this? The problem with using position absolute, like you were was that it was on the elements that will expand. It's important to keep them relative to other dom elements. However, the list numbers are fine, as they'll stay on one line, which will be inline with the first line of text.

ol,li {
    padding: 0;
    margin:0    
}

ol {
    list-style:none;
    counter-reset: item 
}

li:before {
    content: counters(item, ".") " "; 
    counter-increment: item ;
    position:absolute;
}

li {
  position:relative;
}

li span{
    position: relative;
    left: 50px;
}

<ol>
        <li><span> omnis ab quasi voluptatem voluptatem consequuntur sed fugit beeaque totam inventore sed ut sit dolores perspiciatis inventore ipsa totam ipsam ipsam, </span>
            <ol>
                <li><span> omnis ab quasi voluptatem voluptatem consequuntur sed fugit bsam ipsam, perspiciatis sed inventore eaque totam inventore sed ut sit dolores perspiciatis inventore ipsa totam ipsam ipsam, </span>
                </li>
                <li><span> omnis ab quasi voluptatem voluptatem consequuntur sed fugit beatae veritatis sed quperspiciatis inventore ipsa totam ipsam ipsam, </span>
                </li>
                <ol>
                    <li><span> omnis ab quasi voluptatem voluptatem consequuntur sed fugit is ab quasi voluptatem voluptatem consequuntur sed fugit beatae veritatis sed quae dolores iste quasi ipsam ipsam, perspiciatis sed inventore eaque totam inventore sed ut sit dolores perspiciatis inventore ipsa totam ipsam ipsam,</span>
                    </li>
                </ol>
            </ol>
        </li>

        <li><span> omnis ab quasi voluptatem voluptatem consequuntur sed fugitrspiciatis sed inventore eaque totam inventore sed ut sit dolores perspiciatis inventore ipsa totam ipsam ipsam, </span>
        </li>
        <li><span> omnis ab quasi voluptatem voluptatem consequuntur sed fugit beatae ve totam inventore sed ut sit dolores perspiciatis inventore ipsa totam ipsam ipsam, </span>
        </li>
    </ol>