From 523aa5ce448fb9078685c15183436005eeb6a491 Mon Sep 17 00:00:00 2001
From: James <66140148+koffietiger@users.noreply.github.com>
Date: Tue, 7 Feb 2023 09:07:50 +0000
Subject: [PATCH] Added CSS Required for Setup (#3711)

* Added CSS Setup Context

It was previously not clear that additional CSS was required to display placeholders.

* Fixed Typo.
---
 docs/api/extensions/placeholder.md | 25 +++++++++++++++++++++++++
 1 file changed, 25 insertions(+)

diff --git a/docs/api/extensions/placeholder.md b/docs/api/extensions/placeholder.md
index 720efc5a5..ba505ee25 100644
--- a/docs/api/extensions/placeholder.md
+++ b/docs/api/extensions/placeholder.md
@@ -14,6 +14,31 @@ This extension provides placeholder support. Give your users an idea what they s
 npm install @tiptap/extension-placeholder
 ```
 
+### Additional Setup
+Placeholders are displayed with the help of CSS.
+
+**Display a Placeholder only for the first line in an empty editor.**
+```
+.ProseMirror p.is-editor-empty:first-child::before {
+  color: #adb5bd;
+  content: attr(data-placeholder);
+  float: left;
+  height: 0;
+  pointer-events: none;
+}
+```
+**Display Placeholders on every new line.**
+```
+.ProseMirror p.is-empty::before {
+  color: #adb5bd;
+  content: attr(data-placeholder);
+  float: left;
+  height: 0;
+  pointer-events: none;
+}
+```
+
+
 ## Settings
 
 ### emptyEditorClass