CSS - Placeholder support for contentEditable elements

contentEditable-placeholder.css

/ *
  * Exemple:
  * <div contenteditable="true" placeholder="Enter text here..."></div>
  *
  */

[contenteditable=true]:empty:before {
  content: attr(placeholder);
}

I had some issues in Edge with this, when copying/pasting. It was pasting all of the paragraphs in reverse order and this was fixed by replacing before with after. No idea why that fixed it, but i'd love to know.

I have added not(:focus), and now it`s working for IE also

&[contenteditable]:not(:focus):empty:before {
	content: attr(placeholder);
	display: block;
}