update form demo

components/form/__tests__/__snapshots__/demo.test.js.snap

@@ -431,7 +431,7 @@ exports[`renders ./components/form/demo/coordinated.md correctly 1`] = `
     class="ant-row ant-form-item"
   >
     <div
-      class="ant-col-4 ant-form-item-label"
+      class="ant-col-5 ant-form-item-label"
     >
       <label
         class="ant-form-item-required"
@@ -442,7 +442,7 @@ exports[`renders ./components/form/demo/coordinated.md correctly 1`] = `
       </label>
     </div>
     <div
-      class="ant-col-8 ant-form-item-control-wrapper"
+      class="ant-col-12 ant-form-item-control-wrapper"
     >
       <div
         class="ant-form-item-control "
@@ -462,7 +462,7 @@ exports[`renders ./components/form/demo/coordinated.md correctly 1`] = `
     class="ant-row ant-form-item"
   >
     <div
-      class="ant-col-4 ant-form-item-label"
+      class="ant-col-5 ant-form-item-label"
     >
       <label
         class="ant-form-item-required"
@@ -473,7 +473,7 @@ exports[`renders ./components/form/demo/coordinated.md correctly 1`] = `
       </label>
     </div>
     <div
-      class="ant-col-8 ant-form-item-control-wrapper"
+      class="ant-col-12 ant-form-item-control-wrapper"
     >
       <div
         class="ant-form-item-control "
@@ -517,7 +517,7 @@ exports[`renders ./components/form/demo/coordinated.md correctly 1`] = `
     class="ant-row ant-form-item"
   >
     <div
-      class="ant-col-8 ant-col-offset-4 ant-form-item-control-wrapper"
+      class="ant-col-12 ant-col-offset-5 ant-form-item-control-wrapper"
     >
       <div
         class="ant-form-item-control "
@@ -1456,7 +1456,7 @@ exports[`renders ./components/form/demo/register.md correctly 1`] = `
             >
               <div
                 class="ant-select ant-select-enabled"
-                style="width:64px"
+                style="width:70px"
               >
                 <div
                   aria-autocomplete="list"

components/form/demo/coordinated.md

@@ -39,8 +39,8 @@ class App extends React.Component {
       <Form onSubmit={this.handleSubmit}>
         <FormItem
           label="Note"
-          labelCol={{ span: 4 }}
-          wrapperCol={{ span: 8 }}
+          labelCol={{ span: 5 }}
+          wrapperCol={{ span: 12 }}
         >
           {getFieldDecorator('note', {
             rules: [{ required: true, message: 'Please input your note!' }],
@@ -50,8 +50,8 @@ class App extends React.Component {
         </FormItem>
         <FormItem
           label="Gender"
-          labelCol={{ span: 4 }}
-          wrapperCol={{ span: 8 }}
+          labelCol={{ span: 5 }}
+          wrapperCol={{ span: 12 }}
         >
           {getFieldDecorator('gender', {
             rules: [{ required: true, message: 'Please select your gender!' }],
@@ -66,7 +66,7 @@ class App extends React.Component {
           )}
         </FormItem>
         <FormItem
-          wrapperCol={{ span: 8, offset: 4 }}
+          wrapperCol={{ span: 12, offset: 5 }}
         >
           <Button type="primary" htmlType="submit">
             Submit

components/form/demo/register.md

@@ -115,7 +115,7 @@ class RegistrationForm extends React.Component {
     const prefixSelector = getFieldDecorator('prefix', {
       initialValue: '86',
     })(
-      <Select style={{ width: 64 }}>
+      <Select style={{ width: 70 }}>
         <Option value="86">+86</Option>
         <Option value="87">+87</Option>
       </Select>

components/form/index.en-US.md

@@ -161,7 +161,7 @@ See more advanced usage at [async-validator](https://github.com/yiminghe/async-v
 
 <style>
 .code-box-demo .ant-form:not(.ant-form-inline):not(.ant-form-vertical) {
-  max-width: 540px;
+  max-width: 600px;
 }
 </style>
 

components/form/index.zh-CN.md

@@ -162,7 +162,7 @@ CustomizedForm = Form.create({})(CustomizedForm);
 
 <style>
 .code-box-demo .ant-form:not(.ant-form-inline):not(.ant-form-vertical) {
-  max-width: 540px;
+  max-width: 600px;
 }
 </style>