The list-style-position property

The list-style-position property sets how a list marker will be displayed: inside or outside the ul or ol list.

Syntax

selector {
	list-style-position: inside | outside;
}

Value	Description
`inside`	The marker is inside a list.
`outside`	The marker is outside a list.

Default value: outside.

<ul>
	<li>list item</li>
	<li>list item</li>
	<li>list item</li>
	<li>list item</li>
	<li>list item</li>
</ul>

ul {
	list-style-position: inside;
	border: 1px solid red;
	width: 200px;
	padding-left: 0;
	margin-left: 10px;
}

<ul>
	<li>list item</li>
	<li>list item</li>
	<li>list item</li>
	<li>list item</li>
	<li>list item</li>
</ul>

ul {
	list-style-position: outside;
	border: 1px solid red;
	width: 200px;
	padding-left: 0;
	margin-left: 10px;
}