How to set the position of the list-item marker with JavaScript?


To set the position of the marker of the list-item, use the listStylePosition property. You can try to run the following code to set the position of the list-item marker with JavaScript −

Example

Live Demo

<!DOCTYPE html>
<html>
   <body>
      <ol id="myID">
         <li>One</li>
         <li>Two</li>
      </ol>
      <button type="button" onclick="displayInside()">Add list inside</button>
      <button type="button" onclick="displayOutside()">Add list outside</button>
      <script>
         function displayInside() {
            document.getElementById("myID").style.listStylePosition = "inside";
         }
         function displayOutside() {
            document.getElementById("myID").style.listStylePosition = "outside";
         }
      </script>
   </body>
</html>

Updated on: 23-Jun-2020

109 Views

Kickstart Your Career

Get certified by completing the course

Get Started
Advertisements