update Modal

change DOM of Modal，fixed mask scroll bug in chrome 55，fixed mask cover
scrollbar bug

test/routers/more.vue

@@ -1,39 +1,40 @@
-<style>
-    body{
-        height: 2000px !important;
+<style lang="less">
+    .vertical-center-modal{
+        display: flex;
+        align-items: center;
+        justify-content: center;
+
+    .ivu-modal{
+        top: 0;
+    }
     }
 </style>
 <template>
-    <i-button type="primary" @click="modal1 = true">显示对话框</i-button>
-    <i-button @click="scrollable = !scrollable">Toggle scrollable</i-button>
-    scrollable:{{scrollable}}
+    <i-button @click="modal9 = true">距离顶部 20px</i-button>
     <Modal
-            :visible.sync="modal1"
-            title="普通的Modal对话框标题"
-            :scrollable="scrollable"
-            @on-ok="ok"
-            @on-cancel="cancel">
+            title="对话框标题"
+            :visible.sync="modal9"
+            :style="{top: '20px'}">
+        <p>对话框内容</p>
+        <p>对话框内容</p>
+        <p>对话框内容</p>
+    </Modal>
+    <i-button @click="modal10 = true">垂直居中</i-button>
+    <Modal
+            title="对话框标题"
+            :visible.sync="modal10"
+            class-name="vertical-center-modal">
         <p>对话框内容</p>
         <p>对话框内容</p>
         <p>对话框内容</p>
-        <i-button @click="scrollable = !scrollable">Toggle scrollable</i-button>
     </Modal>
 </template>
 <script>
     export default {
         data () {
             return {
-                modal1: false,
-                scrollable: false
-            }
-        },
-        methods: {
-            ok () {
-                this.$nextTick(() => this.modal1 = true);
-                this.$Message.info('点击了确定');
-            },
-            cancel () {
-                this.$Message.info('点击了取消');
+                modal9: false,
+                modal10: false,
             }
         }
     }