diff --git a/app/assets/stylesheets/common/d-editor.scss b/app/assets/stylesheets/common/d-editor.scss
index e01d994c11d..4b4ccff2b07 100644
--- a/app/assets/stylesheets/common/d-editor.scss
+++ b/app/assets/stylesheets/common/d-editor.scss
@@ -95,6 +95,9 @@
   overflow: auto;
   cursor: default;
   -webkit-overflow-scrolling: touch;
+  // the below gives text little space to overflow without being cropped (e.g., Õ in headings)
+  padding-top: 1em;
+  margin-top: -1em;
 }
 
 .d-editor-input,
@@ -167,12 +170,15 @@
   }
   .d-editor-preview-wrapper {
     max-width: 100%;
-    margin: 10px 0 0 0;
+    margin: 0;
+    padding: 0;
   }
   .d-editor-preview {
     background-color: var(--primary-very-low);
-    padding: 5px;
+    margin-top: 1em;
+    padding: 0.667em;
     &:empty {
+      margin: 0;
       padding: 0;
     }
   }
diff --git a/app/assets/stylesheets/desktop/compose.scss b/app/assets/stylesheets/desktop/compose.scss
index e7706c2c134..c3423a356d2 100644
--- a/app/assets/stylesheets/desktop/compose.scss
+++ b/app/assets/stylesheets/desktop/compose.scss
@@ -27,20 +27,24 @@
 }
 
 .edit-title {
+  --overflow-buffer: 1em;
+  // this gives text little space to overflow without being cropped (e.g., Õ in headings)
+
   .d-editor-preview-wrapper {
-    margin-top: -43px;
+    margin-top: calc(-41px - var(--overflow-buffer));
+    padding-top: var(--overflow-buffer);
   }
   &:not(.private-message) {
     .d-editor-preview-wrapper {
       @media screen and (max-width: 955px) {
-        margin-top: -77px;
+        margin-top: calc(-75px - var(--overflow-buffer));
       }
     }
   }
 
   .with-tags {
     .d-editor-preview-wrapper {
-      margin-top: -77px;
+      margin-top: calc(-75px - var(--overflow-buffer));
     }
   }
 }