diff --git a/components/_util/isNumeric.ts b/components/_util/isNumeric.ts
new file mode 100644
index 0000000000..2545ed60f9
--- /dev/null
+++ b/components/_util/isNumeric.ts
@@ -0,0 +1,5 @@
+const isNumeric = (value: any): boolean => {
+  return !isNaN(parseFloat(value)) && isFinite(value);
+};
+
+export default isNumeric;
diff --git a/components/drawer/demo/basic-left.md b/components/drawer/demo/basic-left.md
index d247fef729..96851e4065 100644
--- a/components/drawer/demo/basic-left.md
+++ b/components/drawer/demo/basic-left.md
@@ -2,7 +2,7 @@
 order: 1
 title:
   zh-CN: 左侧滑出
-  en-US: Left Silder
+  en-US: Left Slider
 ---
 
 ## zh-CN
diff --git a/components/drawer/demo/multi-level-drawer.md b/components/drawer/demo/multi-level-drawer.md
index 7066cc828c..d2e0355554 100644
--- a/components/drawer/demo/multi-level-drawer.md
+++ b/components/drawer/demo/multi-level-drawer.md
@@ -14,20 +14,9 @@ title:
 Open a new drawer on top of an existing drawer to handle multi branch tasks
 
 ```jsx
-import { Drawer, List, Form, Button, Input, Tag } from 'antd';
+import { Drawer, Button } from 'antd';
 
-const vegetables = ['asparagus', 'bamboo', 'potato', 'carrot', 'cilantro', 'potato', 'eggplant'];
-
-const TagList = ({ value, show }) => {
-  return (
-    <div>
-      {value.map(item => <Tag key={item}>{item}</Tag>)}
-      <Tag onClick={() => show()}>+</Tag>
-    </div>
-  );
-};
-
-class DrawerForm extends React.Component {
+class App extends React.Component {
   state = { visible: false, childrenDrawer: false };
 
   showDrawer = () => {
@@ -55,33 +44,22 @@ class DrawerForm extends React.Component {
   };
 
   render() {
-    const { getFieldDecorator } = this.props.form;
     return (
       <div>
         <Button type="primary" onClick={this.showDrawer}>
-          New Cookbook
+          Open drawer
         </Button>
         <Drawer
-          title="Cookbook"
+          title="Multi-level drawer"
           width={520}
           closable={false}
           onClose={this.onClose}
           visible={this.state.visible}
           push={this.state.childrenDrawer}
         >
-          <Form hideRequiredMark>
-            <Form.Item label="Name">
-              {getFieldDecorator('name', {
-                rules: [{ required: true, message: 'please enter cookbook name' }],
-              })(<Input placeholder="please enter cookbook name" />)}
-            </Form.Item>
-            <Form.Item label="Food">
-              {getFieldDecorator('Food', {
-                rules: [{ required: true, message: 'please enter food' }],
-                initialValue: ['potato', 'eggplant'],
-              })(<TagList show={this.showChildrenDrawer} />)}
-            </Form.Item>
-          </Form>
+          <Button type="primary" onClick={this.showChildrenDrawer}>
+              Two-level drawer
+          </Button>
           <Drawer
             title="Food"
             width={320}
@@ -89,12 +67,7 @@ class DrawerForm extends React.Component {
             onClose={this.onChildrenDrawerClose}
             visible={this.state.childrenDrawer}
           >
-            <List
-              size="small"
-              header={<div>Vegetables</div>}
-              dataSource={vegetables}
-              renderItem={item => <List.Item>{item}</List.Item>}
-            />
+            This is two-level drawer
           </Drawer>
           <div
             style={{
@@ -126,7 +99,6 @@ class DrawerForm extends React.Component {
     );
   }
 }
-const App = Form.create()(DrawerForm);
 
 ReactDOM.render(<App />, mountNode);
 ```
diff --git a/components/drawer/index.en-US.md b/components/drawer/index.en-US.md
index d75b27414f..e078c2a8e0 100644
--- a/components/drawer/index.en-US.md
+++ b/components/drawer/index.en-US.md
@@ -26,7 +26,7 @@ A Drawer is a panel that is typically overlaid on top of a page and slides in fr
 | style | Style of floating layer, typically used for adjusting its position. | object | - |
 | title | The title for Drawer. | string\|ReactNode | - |
 | visible | Whether the Drawer dialog is visible or not. | boolean | false |
-| width | Width of the Drawer dialog. | string\|number | 520 |
+| width | Width of the Drawer dialog. | string\|number | 256 |
 | wrapClassName | The class name of the container of the Drawer dialog. | string | - |
 | zIndex | The `z-index` of the Drawer. | Number | 1000 |
 | placement | The placement of the Drawer. | 'left' \| 'right' | 'right'
diff --git a/components/drawer/index.tsx b/components/drawer/index.tsx
index ea57a409de..85599a834b 100644
--- a/components/drawer/index.tsx
+++ b/components/drawer/index.tsx
@@ -2,6 +2,7 @@ import * as React from 'react';
 import RcDrawer from 'rc-drawer';
 import PropTypes from 'prop-types';
 import createReactContext, { Context } from 'create-react-context';
+import isNumeric from '../_util/isNumeric';
 
 const DrawerContext: Context<Drawer | null> = createReactContext(null);
 
@@ -151,7 +152,7 @@ export default class Drawer extends React.Component<DrawerProps, IDrawerState> {
   }
   renderProvider = (value: Drawer) => {
     let { width, zIndex, style, placement, ...rest } = this.props;
-    if (typeof width === 'number') {
+    if (isNumeric(width)) {
       width = `${width}px`;
     }
     const RcDrawerStyle = this.state.push
diff --git a/components/drawer/style/drawer.less b/components/drawer/style/drawer.less
index ccf704f138..d21b5489e7 100644
--- a/components/drawer/style/drawer.less
+++ b/components/drawer/style/drawer.less
@@ -72,7 +72,6 @@
     background-color: @component-background;
     border: 0;
     background-clip: padding-box;
-    box-shadow: @shadow-2;
     z-index: 1;
   }
 
@@ -147,12 +146,9 @@
 
   &-open {
     overflow: hidden;
+    &-content {
+      box-shadow: @shadow-2;
+    }
   }
 }
 
-@media (max-width: @screen-md) {
-  .@{dawer-prefix-cls} {
-    width: auto !important;
-    margin: 10px;
-  }
-}