revert dom structure

apps/app/src/components/ReactMarkdownComponents/Header.module.scss

@@ -4,7 +4,8 @@
   }
 
   .revision-head-link {
-    padding-right: 0.5em;
+    left: -1em;
+    width: 1em;
     user-select: none;
     opacity: 0;
   }

apps/app/src/components/ReactMarkdownComponents/Header.tsx

@@ -114,18 +114,18 @@ export const Header = (props: HeaderProps): JSX.Element => {
   const showEditButton = !isGuestUser && !isReadOnlyUser && !isSharedUser && shareLinkId == null;
 
   return (
-    <div className={`${moduleClass} d-flex flex-row`}>
-      <NextLink href={`#${id}`} className={`d-none d-md-inline revision-head-link h${props.level}`}>
-        #
-      </NextLink>
-      <div className="d-inline flex-fill">
-        <CustomTag id={id} className={`${isActive ? styles.blink : ''} `}>
-          {children}
-          {showEditButton && (
-            <EditLink line={node.position?.start.line} />
-          )}
-        </CustomTag>
-      </div>
-    </div>
+    <>
+      <CustomTag id={id} className={`position-relative ${moduleClass} ${isActive ? styles.blink : ''} `}>
+        <NextLink href={`#${id}`} className="d-none d-md-inline revision-head-link position-absolute">
+          #
+        </NextLink>
+
+        {children}
+
+        { showEditButton && (
+          <EditLink line={node.position?.start.line} />
+        ) }
+      </CustomTag>
+    </>
   );
 };