diff --git a/config/router.config.js b/config/router.config.js
index 5d6b4e5031a29042e5f46d99a56d9416c18015d4..346a36bbc2798b19a242dee0202dfff956029348 100644
--- a/config/router.config.js
+++ b/config/router.config.js
@@ -249,6 +249,9 @@ module.exports = [
           },
         ],
       },
+      {
+        component: '404',
+      },
     ],
   },
 ];
diff --git a/package.json b/package.json
index 882d405a6cd601dc4dcf67bd644ded4aef5091bc..43cc1e6ab2c9caabba6423a267f21a81c179d558 100755
--- a/package.json
+++ b/package.json
@@ -25,7 +25,7 @@
   "dependencies": {
     "@antv/data-set": "^0.9.0",
     "@babel/runtime": "^7.0.0",
-    "antd": "^3.9.0-beta.2",
+    "antd": "3.9.0-beta.6",
     "bizcharts": "^3.1.10",
     "bizcharts-plugin-slider": "^2.0.3",
     "classnames": "^2.2.6",
diff --git a/src/components/GlobalHeader/index.less b/src/components/GlobalHeader/index.less
index ad305210ec626a05460017d648b48f245cb7949d..ffe6ecbefbd0e3f6b07eb907da9a976bc8b76c21 100644
--- a/src/components/GlobalHeader/index.less
+++ b/src/components/GlobalHeader/index.less
@@ -45,6 +45,7 @@ i.trigger {
 .right {
   float: right;
   height: 100%;
+  width: 324px;
   .action {
     cursor: pointer;
     padding: 0 12px;
diff --git a/src/components/TopNavHeader/index.js b/src/components/TopNavHeader/index.js
index a68c11714f7b6f6ce6fe96aeba611b107e4d5ff2..bf6946de8d7c98eeb5c8d614787c13ea299157df 100644
--- a/src/components/TopNavHeader/index.js
+++ b/src/components/TopNavHeader/index.js
@@ -5,11 +5,31 @@ import BaseMenu from '../SiderMenu/BaseMenu';
 import styles from './index.less';
 
 export default class TopNavHeader extends PureComponent {
+  constructor(props) {
+    super(props);
+
+    this.state = {
+      maxWidth: (props.grid === 'Wide' ? 1200 : window.innerWidth) - 324 - 165 - 4,
+    };
+  }
+
+  static getDerivedStateFromProps(props) {
+    return {
+      maxWidth: (props.grid === 'Wide' ? 1200 : window.innerWidth) - 324 - 165 - 4,
+    };
+  }
+
   render() {
     const { theme, grid, logo } = this.props;
+    const { maxWidth } = this.state;
     return (
       <div className={`${styles.head} ${theme === 'light' ? styles.light : ''}`}>
-        <div className={`${styles.main} ${grid === 'Wide' ? styles.wide : ''}`}>
+        <div
+          ref={ref => {
+            this.maim = ref;
+          }}
+          className={`${styles.main} ${grid === 'Wide' ? styles.wide : ''}`}
+        >
           <div className={styles.left}>
             <div className={styles.logo} key="logo" id="logo">
               <Link to="/">
@@ -17,11 +37,16 @@ export default class TopNavHeader extends PureComponent {
                 <h1>Ant Design Pro</h1>
               </Link>
             </div>
-            <BaseMenu {...this.props} style={{ paddingTop: '9px', border: 'none' }} />
-          </div>
-          <div className={styles.right}>
-            <RightContent {...this.props} />
+            <div
+              style={{
+                flex: 1,
+                maxWidth,
+              }}
+            >
+              <BaseMenu {...this.props} style={{ border: 'none', height: 64 }} />
+            </div>
           </div>
+          <RightContent {...this.props} />
         </div>
       </div>
     );
diff --git a/src/components/TopNavHeader/index.less b/src/components/TopNavHeader/index.less
index 4e544e9b943d06ed4b8a25956d682b7803aa0f27..39184582ff99105e3ed56e95e8d5efc791d36678 100644
--- a/src/components/TopNavHeader/index.less
+++ b/src/components/TopNavHeader/index.less
@@ -8,6 +8,7 @@
   :global {
     .ant-menu-submenu.ant-menu-submenu-horizontal {
       height: 100%;
+      padding-top: 9px;
       .ant-menu-submenu-title {
         height: 100%;
       }
@@ -29,6 +30,9 @@
       flex: 1;
       display: flex;
     }
+    .right {
+      width: 324px;
+    }
   }
 }
 
diff --git a/src/pages/404.js b/src/pages/404.js
index c0004ba0ff8fa253ba5be80e340b759ea3ef7304..8e2f2fa2aaea4c176ab005bb27983d22a32ceea5 100644
--- a/src/pages/404.js
+++ b/src/pages/404.js
@@ -3,5 +3,5 @@ import Link from 'umi/link';
 import Exception from '@/components/Exception';
 
 export default () => (
-  <Exception type="404" linkElement={Link} />
+  <Exception type="404" style={{ minHeight: 500, height: '100%' }} linkElement={Link} />
 );