From b3095a703c5b0413aa479b600843fe488fbe3183 Mon Sep 17 00:00:00 2001
From: "qingwei.li" <cinwell.li@gmail.com>
Date: Tue, 27 Dec 2016 17:28:58 +0800
Subject: [PATCH] DatePicker: input display style changes to block, fixed #2018

---
 examples/docs/en-US/date-picker.md                | 7 +++++++
 examples/docs/en-US/datetime-picker.md            | 7 +++++++
 examples/docs/en-US/time-picker.md                | 7 +++++++
 examples/docs/zh-CN/date-picker.md                | 7 +++++++
 examples/docs/zh-CN/datetime-picker.md            | 7 +++++++
 examples/docs/zh-CN/time-picker.md                | 4 ++++
 packages/theme-default/src/date-picker/picker.css | 3 ---
 7 files changed, 39 insertions(+), 3 deletions(-)

diff --git a/examples/docs/en-US/date-picker.md b/examples/docs/en-US/date-picker.md
index 3c2eeed8a..19025022d 100644
--- a/examples/docs/en-US/date-picker.md
+++ b/examples/docs/en-US/date-picker.md
@@ -1,3 +1,10 @@
+<style>
+  .demo-date-picker .el-input {
+    width: 180px;
+    margin: auto;
+  }
+</style>
+
 <script>
   module.exports = {
     data() {
diff --git a/examples/docs/en-US/datetime-picker.md b/examples/docs/en-US/datetime-picker.md
index dbd481c48..eedf380e9 100644
--- a/examples/docs/en-US/datetime-picker.md
+++ b/examples/docs/en-US/datetime-picker.md
@@ -1,3 +1,10 @@
+<style>
+  .demo-datetime-picker .el-input {
+    width: 180px;
+    margin: auto;
+  }
+</style>
+
 <script>
   module.exports = {
     data() {
diff --git a/examples/docs/en-US/time-picker.md b/examples/docs/en-US/time-picker.md
index f934ce69b..241427c59 100644
--- a/examples/docs/en-US/time-picker.md
+++ b/examples/docs/en-US/time-picker.md
@@ -1,3 +1,10 @@
+<style>
+  .demo-time-picker .el-input {
+    width: 180px;
+    display: inline-block;
+  }
+</style>
+
 ## TimePicker
 
 Use Time Picker for time input.
diff --git a/examples/docs/zh-CN/date-picker.md b/examples/docs/zh-CN/date-picker.md
index 287eff225..dd4a96e2d 100644
--- a/examples/docs/zh-CN/date-picker.md
+++ b/examples/docs/zh-CN/date-picker.md
@@ -1,3 +1,10 @@
+<style>
+  .demo-date-picker .el-input {
+    width: 180px;
+    margin: auto;
+  }
+</style>
+
 <script>
   module.exports = {
     data() {
diff --git a/examples/docs/zh-CN/datetime-picker.md b/examples/docs/zh-CN/datetime-picker.md
index 52adf6457..a9c7a262f 100644
--- a/examples/docs/zh-CN/datetime-picker.md
+++ b/examples/docs/zh-CN/datetime-picker.md
@@ -1,3 +1,10 @@
+<style>
+  .demo-datetime-picker .el-input {
+    width: 180px;
+    margin: auto;
+  }
+</style>
+
 <script>
   module.exports = {
     data() {
diff --git a/examples/docs/zh-CN/time-picker.md b/examples/docs/zh-CN/time-picker.md
index 58f4ebd1f..8eebeb3a1 100644
--- a/examples/docs/zh-CN/time-picker.md
+++ b/examples/docs/zh-CN/time-picker.md
@@ -1,4 +1,8 @@
 <style>
+  .demo-time-picker .el-input {
+    width: 180px;
+    display: inline-block;
+  }
   .demo-box {
     .el-date-editor + .el-date-editor {
       margin-left: 10px;
diff --git a/packages/theme-default/src/date-picker/picker.css b/packages/theme-default/src/date-picker/picker.css
index 7fc4832bd..195813695 100644
--- a/packages/theme-default/src/date-picker/picker.css
+++ b/packages/theme-default/src/date-picker/picker.css
@@ -3,9 +3,6 @@
 
 @component-namespace el {
   @b date-editor {
-    position: relative;
-    display: inline-block;
-
     .el-picker-panel {
       position: absolute;
       min-width: 180px;