fix inline form style

examples/docs/en-US/form.md

@@ -204,6 +204,8 @@
       width: 480px;
     }
     .demo-form-inline {
+      width: auto;
+
       .el-input {
         width: 150px;
       }
@@ -320,9 +322,10 @@ When the vertical space is limited and the form is relatively simple, you can pu
 
 ```html
 <el-form :inline="true" :model="formInline" class="demo-form-inline">
-  <el-form-item>
+  <el-form-item label="Approved by">
     <el-input v-model="formInline.user" placeholder="Approved by"></el-input>
-  </el-form-item><el-form-item>
+  </el-form-item>
+  <el-form-item label="Activity zone">
     <el-select v-model="formInline.region" placeholder="Activity zone">
       <el-option label="Zone one" value="shanghai"></el-option>
       <el-option label="Zone two" value="beijing"></el-option>

examples/docs/zh-CN/form.md

@@ -199,6 +199,8 @@
       width: 440px;
     }
     .demo-form-inline {
+      width: auto;
+
       .el-input {
         width: 150px;
       }
@@ -313,9 +315,10 @@
 ::: demo 设置 `inline` 属性可以让表单域变为行内的表单域
 ```html
 <el-form :inline="true" :model="formInline" class="demo-form-inline">
-  <el-form-item>
+  <el-form-item label="审批人">
     <el-input v-model="formInline.user" placeholder="审批人"></el-input>
-  </el-form-item><el-form-item>
+  </el-form-item>
+  <el-form-item label="活动区域">
     <el-select v-model="formInline.region" placeholder="活动区域">
       <el-option label="区域一" value="shanghai"></el-option>
       <el-option label="区域二" value="beijing"></el-option>

packages/theme-default/src/form.css

@@ -21,6 +21,10 @@
         margin-right: 10px;
         vertical-align: top;
       }
+      & .el-form-item__label,
+      & .el-form-item__content {
+        display: inline-block;
+      }
     }
   }
   @b form-item {