diff --git a/web/src/components/MobileHeader.tsx b/web/src/components/MobileHeader.tsx
index 4b6c7f28..c521f283 100644
--- a/web/src/components/MobileHeader.tsx
+++ b/web/src/components/MobileHeader.tsx
@@ -28,7 +28,7 @@ const MobileHeader = (props: Props) => {
   }, [filter, shortcuts]);
 
   return (
-    <div className="sticky top-0 pt-4 pb-1 mb-1 backdrop-blur-sm flex sm:hidden flex-row justify-between items-center w-full h-auto flex-nowrap shrink-0 z-1">
+    <div className="sticky top-0 pt-4 pb-1 mb-1 backdrop-blur-sm flex sm:hidden flex-row justify-between items-center w-full h-auto flex-nowrap shrink-0 z-2">
       <div className="flex flex-row justify-start items-center mr-2 shrink-0 overflow-hidden">
         <div
           className="flex sm:hidden flex-row justify-center items-center w-6 h-6 mr-1 shrink-0 bg-transparent"
diff --git a/web/src/less/memo-content.less b/web/src/less/memo-content.less
index 15bda7c6..e8253cfa 100644
--- a/web/src/less/memo-content.less
+++ b/web/src/less/memo-content.less
@@ -107,8 +107,7 @@
   }
 
   > .expand-btn-container {
-    @apply w-full relative flex flex-row justify-start items-center;
-
+    @apply w-full relative flex flex-row justify-start items-center z-1;
     > .btn {
       @apply flex flex-row justify-start items-center pl-2 pr-1 py-1 my-2 text-xs rounded-lg border bg-gray-100 dark:bg-zinc-600 border-gray-200 dark:border-zinc-600 shadow hover:opacity-90 cursor-pointer;
 
diff --git a/web/tailwind.config.js b/web/tailwind.config.js
index 50fe8281..f52061c6 100644
--- a/web/tailwind.config.js
+++ b/web/tailwind.config.js
@@ -24,6 +24,7 @@ module.exports = {
       },
       zIndex: {
         1: "1",
+        2: "2",
         20: "20",
         100: "100",
         1000: "1000",