リスト
list-style-position
list-style-position は、リストの印（マーカー）を項目の外側に出すか、項目の中に入れるかを指定します。
構文
inside | outsideプレビュー
りんご
Banana
みかん
プリセット
右下の角をドラッグするとサイズを変えられます
コード
.box {
list-style-position: inside;
}コントロール
list-style-positioninside
りんご
Banana
みかん
解説
値の意味
outside：印を項目の箱の外（横書きでは左）に出します。初期値です。項目が何行かに折り返しても、2 行目以降は 1 行目の文字の頭にそろいます。inside：印を項目の中に入れ、1 行目の最初の文字のように並べます。折り返した行は印の下、項目の端から始まります。
このページのプレビューでは、項目の箱に色を付けているので、印が箱の外に出ているか中に入っているかが見えます。
気をつけること
outsideの印は、ul・olの左の余白（ブラウザの初期値ではpadding-left: 40px）に置かれます。余白を 0 にすると印が箱の外にはみ出し、overflow: hiddenなどで切れて見えなくなります。- 継承するので、
ul・olにまとめて書けます。印の種類と一緒にlist-style: square insideのようにショートハンドでも書けます。