diff --git a/packages/editor-mobile/src/components/editor.tsx b/packages/editor-mobile/src/components/editor.tsx
index 1554ecaf2..689bcd3eb 100644
--- a/packages/editor-mobile/src/components/editor.tsx
+++ b/packages/editor-mobile/src/components/editor.tsx
@@ -882,8 +882,7 @@ const Tiptap = ({
 
           <div
             style={{
-              display: tab.session?.locked ? "none" : "block",
-              lineHeight: settings.defaultLineHeight
+              display: tab.session?.locked ? "none" : "block"
             }}
             ref={contentPlaceholderRef}
             className="theme-scope-editor"
@@ -947,6 +946,7 @@ const TiptapProvider = (): JSX.Element => {
     editorContainer.style.padding = "0px 16px";
     editorContainer.style.color = colors.primary.paragraph;
     editorContainer.style.fontSize = `${settings.fontSize}px`;
+    editorContainer.style.lineHeight = `${settings.defaultLineHeight}`;
     editorContainer.style.fontFamily =
       getFontById(settings.fontFamily)?.font || "sans-serif";
     contentRef.current = editorContainer;
@@ -966,8 +966,9 @@ const TiptapProvider = (): JSX.Element => {
       contentRef.current.style.fontSize = `${settings.fontSize}px`;
       contentRef.current.style.fontFamily =
         getFontById(settings.fontFamily)?.font || "sans-serif";
+      contentRef.current.style.lineHeight = `${settings.defaultLineHeight}`;
     }
-  }, [settings.fontSize, settings.fontFamily]);
+  }, [settings.fontSize, settings.fontFamily, settings.defaultLineHeight]);
 
   return <Tiptap settings={settings} getContentDiv={getContentDiv} />;
 };
diff --git a/packages/editor/src/extensions/task-item/component.tsx b/packages/editor/src/extensions/task-item/component.tsx
index 552bda7d9..89bd9baac 100644
--- a/packages/editor/src/extensions/task-item/component.tsx
+++ b/packages/editor/src/extensions/task-item/component.tsx
@@ -93,7 +93,7 @@ export function TaskItemComponent(
               cursor: "grab",
               mr: "0.2rem",
               fontFamily: "inherit",
-              marginTop: "0.065rem"
+              marginTop: "calc((1lh - 18px) / 2)"
             }}
             size={isMobile ? "2.46ch" : "2.22ch"}
           />
@@ -117,7 +117,7 @@ export function TaskItemComponent(
                   borderColor: "accent"
                 },
             fontFamily: "inherit",
-            marginTop: "0.13rem"
+            marginTop: "calc((1lh - 16px) / 2)"
           }}
           onMouseDown={(e) => {
             if (globalThis.keyboardShown) {
@@ -155,7 +155,7 @@ export function TaskItemComponent(
             bg: "background",
             opacity: 0,
             alignSelf: "flex-start",
-            marginTop: "0.16rem"
+            marginTop: "calc((1lh - 14px) / 2)"
           }}
         >
           {editor.isEditable && (
diff --git a/packages/editor/styles/styles.css b/packages/editor/styles/styles.css
index 26ec1cca2..aad26cf2d 100644
--- a/packages/editor/styles/styles.css
+++ b/packages/editor/styles/styles.css
@@ -604,7 +604,7 @@ p > *::selection {
 
 .outline-list > li::before {
   position: absolute;
-  top: 0px;
+  top: calc((1lh - 18px) / 2);
   cursor: pointer;
   content: "";
   background-size: 18px;
@@ -729,7 +729,7 @@ p > *::selection {
 
 .simple-checklist > li::after {
   position: absolute;
-  top: 0px;
+  top: calc((1lh - 18px) / 2);
   cursor: pointer;
   content: "";
   background-size: 18px;
@@ -747,7 +747,7 @@ p > *::selection {
 
 .simple-checklist > li.checked::before {
   position: absolute;
-  top: 2px;
+  top: calc((1lh - 14px) / 2);
   cursor: pointer;
   content: "";
   background-size: 18px;
@@ -790,7 +790,7 @@ p > *::selection {
 
 .ProseMirror div.callout > :first-child::after {
   position: absolute;
-  top: 0px;
+  top: calc((1lh - 18px) / 2);
   right: 0px;
   cursor: pointer;
   content: "";