diff --git a/docs/src/demos/Examples/CollaborativeEditing/style.scss b/docs/src/demos/Examples/CollaborativeEditing/style.scss
index 563c2568..1c7b0e8d 100644
--- a/docs/src/demos/Examples/CollaborativeEditing/style.scss
+++ b/docs/src/demos/Examples/CollaborativeEditing/style.scss
@@ -1,5 +1,6 @@
 .collaboration-users {
   margin-top: 0.5rem;
+
   &__item {
     display: inline-block;
     border-radius: 5px;
@@ -28,15 +29,8 @@
   }
 }
 
-/* this is a rough fix for the first cursor position when the first paragraph is empty */
-.ProseMirror > .collaboration-cursor:first-child {
-  margin-top: 16px;
-}
-.ProseMirror p:first-child, .ProseMirror h1:first-child, .ProseMirror h2:first-child, .ProseMirror h3:first-child, .ProseMirror h4:first-child, .ProseMirror h5:first-child, .ProseMirror h6:first-child {
-  margin-top: 16px
-}
-/* This gives the remote user caret. The colors are automatically overwritten*/
-.collaboration-cursor {
+/* This gives the remote user caret */
+.collaboration-cursor__caret {
   position: relative;
   margin-left: -1px;
   margin-right: -1px;
@@ -45,10 +39,11 @@
   word-break: normal;
   pointer-events: none;
 }
+
 /* This renders the username above the caret */
-.collaboration-cursor > div {
+.collaboration-cursor__label {
   position: absolute;
-  top: -1.05em;
+  top: -1.6em;
   left: -1px;
   font-size: 13px;
   font-style: normal;
diff --git a/packages/extension-collaboration-cursor/index.ts b/packages/extension-collaboration-cursor/index.ts
index 8fcd0fcf..cacb30a9 100644
--- a/packages/extension-collaboration-cursor/index.ts
+++ b/packages/extension-collaboration-cursor/index.ts
@@ -34,10 +34,11 @@ export default new Extension<CollaborationCursorOptions>()
     color: '#cccccc',
     render: user => {
       const cursor = document.createElement('span')
-      cursor.classList.add('collaboration-cursor')
+      cursor.classList.add('collaboration-cursor__caret')
       cursor.setAttribute('style', `border-color: ${user.color}`)
 
       const label = document.createElement('div')
+      label.classList.add('collaboration-cursor__label')
       label.setAttribute('style', `background-color: ${user.color}`)
       label.insertBefore(document.createTextNode(user.name), null)
       cursor.insertBefore(label, null)