update form typography

components/form/demo/form-controls.md

@@ -34,7 +34,7 @@ React.render(
     </div>
   </div>
   <div className="ant-form-item">
-    <label className="col-6">ant-select：</label>
+    <label className="col-6">Select 选择器：</label>
     <div className="col-14">
       <Select value="lucy" style={{width:200}} onChange={handleSelectChange}>
         <Option value="jack">jack</Option>
@@ -45,7 +45,7 @@ React.render(
     </div>
   </div>
   <div className="ant-form-item ant-form-item-compact">
-    <label className="col-6">ant-checkbox：</label>
+    <label className="col-6">Checkbox 多选框：</label>
     <div className="col-18">
       <label className="ant-checkbox-vertical">
         <Checkbox /> 选项一
@@ -59,7 +59,7 @@ React.render(
     </div>
   </div>
   <div className="ant-form-item ant-form-item-compact">
-    <label className="col-6">ant-checkbox：</label>
+    <label className="col-6">Checkbox 多选框：</label>
     <div className="col-18">
       <label className="ant-checkbox-inline">
         <Checkbox />选项一
@@ -73,7 +73,7 @@ React.render(
     </div>
   </div>
   <div className="ant-form-item ant-form-item-compact">
-    <label className="col-6">ant-radio：</label>
+    <label className="col-6">Radio 单选框：</label>
     <div className="col-18">
       <RadioGroup value="b">
         <Radio value="a">A</Radio>
@@ -83,13 +83,6 @@ React.render(
       </RadioGroup>
     </div>
   </div>
-  <div className="ant-form-item ant-form-item-compact">
-    <label className="col-6" for="InputFile">头像：</label>
-    <div className="col-18">
-      <input type="file" id="InputFile" className="ant-upload" />
-      <p className="ant-form-explain">请选择一个文件</p>
-    </div>
-  </div>
 </form>
 , document.getElementById('components-form-demo-form-controls'));
 ````

components/form/demo/mix.md

@@ -39,15 +39,15 @@ function onInputNumberChange(v){
 React.render(
 <form className="ant-form-horizontal">
   <div className="ant-form-item">
-    <label className="col-6" required>Input-Number:</label>
+    <label className="col-8" required>InputNumber 数字输入框：</label>
     <div className="col-10">
       <InputNumber min={1} max={10} defaultValue={3} onChange={onInputNumberChange} style={{width:100}}/>
       <span className="ant-form-text"> 台机器</span>
     </div>
   </div>
   <div className="ant-form-item ant-form-item-compact">
-    <label className="col-6" required>
+    <label className="col-8" required>
-      <i className="anticon anticon-exclamation-circle" style={{color: '#f60'}}></i> 我是标题:
+      <i className="anticon anticon-exclamation-circle" style={{color: '#f60'}}></i> 我是标题：
     </label>
     <div className="col-10">
       <p className="ant-form-text">唧唧复唧唧木兰当户织呀</p>
@@ -57,20 +57,20 @@ React.render(
     </div>
   </div>
   <div className="ant-form-item">
-    <label for="" className="col-6" required>Switch 开关:</label>
+    <label for="" className="col-8" required>Switch 开关：</label>
     <div className="col-10">
       <Switch />
     </div>
   </div>
   <div className="ant-form-item">
-    <label for="" className="col-6" required>Slider 滑动输入条:</label>
+    <label for="" className="col-8" required>Slider 滑动输入条：</label>
     <div className="col-10">
       <Slider marks={["A","B","C","D","E","F","G"]} />
     </div>
   </div>
   <div className="ant-form-item">
-    <label for="" className="col-6" required>Select 选择器:</label>
+    <label for="" className="col-8" required>Select 选择器：</label>
-    <div className="col-18">
+    <div className="col-16">
       <Select value="lucy" style={{width:200}} onChange={handleSelectChange}>
         <Option value="jack">jack</Option>
         <Option value="lucy">lucy</Option>
@@ -80,7 +80,7 @@ React.render(
     </div>
   </div>
   <div className="ant-form-item">
-    <label for="" className="col-6" required>Datepicker:</label>
+    <label for="" className="col-8" required>Datepicker 日期选择框：</label>
     <div className="col-6">
       <Datepicker value="" />
     </div>
@@ -92,7 +92,7 @@ React.render(
     </div>
   </div>
   <div className="ant-form-item has-error">
-    <label for="" className="col-6" required>Datepicker 校验:</label>
+    <label for="" className="col-8" required>Datepicker 校验：</label>
     <div className="col-6">
       <Datepicker value="" />
     </div>
@@ -102,7 +102,7 @@ React.render(
     <div className="col-6">
       <Datepicker value="" />
     </div>
-    <div className="col-19 col-offset-6">
+    <div className="col-19 col-offset-8">
       <p className="ant-form-explain">请输入正确选项</p>
     </div>
   </div>

style/components/form.less

@@ -71,12 +71,16 @@ input[type="checkbox"] {
 // You should wrap labels and controls in .@{css-prefix}form-item for optimum spacing
 .@{css-prefix}form-item {
   margin-bottom: @form-item-margin-bottom;
+  color: #666;
 
   > label {
     color: @label-color;
     text-align: right;
-    padding-right: 8px;
     vertical-align: middle;
+
+    &:lang(en) {
+      padding-right: 8px;
+    } 
   }
 
   .@{css-prefix}switch {
@@ -231,13 +235,7 @@ form {
   @media (min-width: @screen-sm-min) {
     .@{css-prefix}form-item {
       display: inline-block;
-      margin-bottom: 0;
-      vertical-align: middle;
       margin-right: 10px;
-
-      label {
-        padding-right: 0;
-      }
     }
 
     .@{css-prefix}input {