diff --git a/src/content.less b/src/content.less
index c8dd374..565b7fe 100644
--- a/src/content.less
+++ b/src/content.less
@@ -15,7 +15,9 @@
   @media (min-width: @width-with-gitako) {
     margin-left: 0;
   }
+}
 
+.@{name}-ready {
   .Header > div {
     width: 1012px;
     margin: 0 auto;
diff --git a/src/driver/core/SideBar.ts b/src/driver/core/SideBar.ts
index 2bcac3f..b9a06ea 100644
--- a/src/driver/core/SideBar.ts
+++ b/src/driver/core/SideBar.ts
@@ -128,6 +128,7 @@ const init: MethodCreator<Props, ConnectorState> = dispatch => async () => {
     dispatch.call(setMetaData, metaData)
     const shouldShow = URLHelper.isInCodePage(metaData)
     dispatch.call(setShouldShow, shouldShow)
+    DOMHelper.markGitakoReadyState()
   } catch (err) {
     dispatch.call(handleError, err)
   }
diff --git a/src/utils/DOMHelper.ts b/src/utils/DOMHelper.ts
index 7aeb3c5..686d0d0 100644
--- a/src/utils/DOMHelper.ts
+++ b/src/utils/DOMHelper.ts
@@ -7,6 +7,14 @@ import * as NProgress from 'nprogress'
 
 NProgress.configure({ showSpinner: false })
 
+/**
+ * when gitako is ready, make page's header narrower
+ */
+function markGitakoReadyState() {
+  const readyClassName = 'gitako-ready'
+  document.body.classList.add(readyClassName)
+}
+
 /**
  * if should show gitako, then move body right to make space for showing gitako
  * otherwise, hide the space
@@ -355,6 +363,7 @@ export default {
   getCurrentPageType,
   getRepoPageType,
   insertLogoMountPoint,
+  markGitakoReadyState,
   setBodyIndent,
   scrollToNodeElement,
   scrollToRepoContent,