Edit This Code:
<!DOCTYPE html>
<html>
<head>
<style>
ul.a {
    list-style-position: inside;
}


ul.b {
    list-style-position: outside;
}

</style>
</head>
<body>

<p>The following list has list-style-position: inside:</p>

<ul class="a">
  <li>Earl Grey Tea - A fine black tea</li>
  <li>Jasmine Tea - A fabulous "all purpose" tea</li>
  <li>Honeybush Tea - A super fruity delight tea</li>
</ul>

<p>The following list has list-style-position: outside:</p>

<ul class="b">
  <li>Earl Grey Tea - A fine black tea</li>
  <li>Jasmine Tea - A fabulous "all purpose" tea</li>
  <li>Honeybush Tea - A super fruity delight tea</li>
</ul>

<p>"list-style-position: outside" is the default setting.</p>

</body>
</html>


Result:
Try it Yourself - © w3schools.com
Privacy Policy