sets the indent for the list items


margin-left: ***;

Browser
Internet Explorer Firefox Opera

The margin-left property sets the left margin of an element.

When you apply this property to the LI element, the indent for the list items can be specified.


.example {
margin-left: 30px;
}


Property Value Explanation
margin-left length, %, or auto the left margin

Example

<html>
<head>
<title>TAG index</title>

<style type="text/css">

.example1 { margin-left: 25px; }

</style>

</head>
<body>

<ul>
<li>First list item</li>
<li>Second list item</li>
<li class="example1">Third list item</li>
<li class="example1">Fourth list item</li>
<li>Fifth list item</li>
<li>Sixth list item</li>
</ul>

</body>
</html>
Output
  • First list item
  • Second list item
  • Third list item
  • Fourth list item
  • Fifth list item
  • Sixth list item

Nested list example

<html>
<head>
<title>TAG index</title>

<style type="text/css">

.example2 li li { margin-left: -25px; }

</style>

</head>
<body>

<ul>
<li>First list item</li>
<li>Second list item
<ul>
<li>Third list item</li>
<li>Fourth list item</li>
</ul>
</li>
<li>Fifth list item</li>
<li>Sixth list item</li>
</ul>

<ul class="example2">
<li>First list item</li>
<li>Second list item
<ul>
<li>Third list item</li>
<li>Fourth list item</li>
</ul>
</li>
<li>Fifth list item</li>
<li>Sixth list item</li>
</ul>

</body>
</html>
Output
  • First list item
  • Second list item
    • Third list item
    • Fourth list item
  • Fifth list item
  • Sixth list item
  • First list item
  • Second list item
    • Third list item
    • Fourth list item
  • Fifth list item
  • Sixth list item