ol li の回り込みの避け方について

<ol>
<li>テキストテキスト</li>
<li>テキストテキスト</li>
<li>テキストテキストテキストテキスト</li>
</ol>

このような文章を限られたwidthで表示させると、

１、テキストテキスト
２、テキストテキスト
３、テキストテキスト
テキストテキスト

このように表示されてしまうのですが、
これを番号の下に回り込まずに

１、テキストテキスト
２、テキストテキスト
３、テキストテキスト
　　テキストテキスト

このように表示させるにはどのようなスタイルを書けばよいのでしょうか？
ご教授願います。

No.1 回答者： Ogre7077 回答日時： 2016/12/14 11:56

おそらく現状がこうなっています。

ol { padding-left:0; }
ol li {list-style: decimal inside;}

この様に変更しましょう。
ol { padding-left:1.5em; }
ol li { list-style: decimal outside; }

何らかの理由で変更できないなら、条件をつけましょう。
ol.indented { padding-left:1.5em; }
ol.indented li { list-style: decimal outside; }

<ol class=indented><li>...

No.2 回答者： ORUKA1951 回答日時： 2016/12/18 11:54

ブラウザのデフォルトで、ist-style-positionの値が、insideになっている。

どの指定が有効になっているかは、firebug( https://addons.mozilla.org/ja/firefox/addon/fire … )などで確認しましょう。
　その詳細度を確認の上、それより高い詳細度で、outsideに変更します。
　￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣
　詳細度などカスケーディングの仕組みは、CSS--カスケーディングスタイルシート--を扱ううえで最初に身に着けておかないと、使えないです。
5 セレクター( https://momdo.github.io/css2/selector.html )
6 プロパティ値とカスケーディング、継承の割り当て( https://momdo.github.io/css2/cascade.html )

　とりあえず、下記で対処しておきましよう。(詳細度が1000なので外から変更できなくなるけど)
<ol style="list-style-position:outside;margin-left:2em;">
<li>テキストテキスト</li>
<li>テキストテキスト</li>
<li>テキストテキストテキストテキスト</li>
</ol>
　margin-leftは必要に応じて・・・

★ist-style-position( https://momdo.github.io/css2/generate.html#propd … )