diff --git a/src/components/sp-page/header.js b/src/components/sp-page/header.js
index 48d4bc820..2e6142fac 100644
--- a/src/components/sp-page/header.js
+++ b/src/components/sp-page/header.js
@@ -38,7 +38,8 @@ const CustomNavigationHeader = memo((props) => {
       height: `${gNavbarH}px`,
       backgroundSize: '100% 100%',
       backgroundRepeat: 'no-repeat',
-      backgroundPosition: 'center'
+      backgroundPosition: 'center',
+      paddingTop: `${gStatusBarHeight}px`,
     }
     if (value?.navigateBackgroundColorr) {
       style.backgroundColor = value?.navigateBackgroundColor
diff --git a/src/components/sp-page/index.scss b/src/components/sp-page/index.scss
index 0a4c69a50..55842fc73 100644
--- a/src/components/sp-page/index.scss
+++ b/src/components/sp-page/index.scss
@@ -139,9 +139,7 @@
     }
 
     .header-container {
-      height: 64px;
-      margin-top: 52px;
-      line-height: 64px;
+      height: 100%;
       padding: 0 30px;
       position: relative;
       display: flex;