How to Remove the Border of Editable Content

Learn how to remove the border from editable elements.

Remove the border of editable content

By default, when you are in contenteditable Set to true when you write content within the element, the element will get a border when focused.

However, you can use CSS to remove the border:

<p contenteditable="true">This is an editable paragraph.</p>

Use [Attribute] The selector selects all contenteditable elements and uses outline Remove Border of Attribute:

[contenteditable] {
  outline: 0px solid transparent;
}