execCommand indent & outdent Example

execCommand indent & outdent Example

by Adi Jaya

HTML

<p>
  <button onclick='thisCommand( "indent" );'>Indent</button>
  <button onclick='thisCommand( "outdent" );'>Outdent</button>
</p>

<div contenteditable='true'>
  <ul>
    <li>List 1</li>
    <li>List 2</li>
    <li>List 3 [Indent and Outdent this]</li>
    <li>List 4</li>
  </ul>
</div>

CSS

[contenteditable] {
  padding: 15px;
  border: 1px solid silver;
}

JavaScript

function thisCommand(cmd){
	document.execCommand(cmd, false, true);
}