From c29323b448a98c7c5519f62cde074f695338eb9e Mon Sep 17 00:00:00 2001
From: zombieJ <smith3816@gmail.com>
Date: Tue, 19 Feb 2019 23:24:07 +0800
Subject: [PATCH] Revert to remove FormItem explain-holder (#14937)

* Revert "Adjust style to be similar with origin (#14886)"

This reverts commit 735175e3cf51870fef8151ad2c381f69f5073fd8.

* Revert "sync form item (#14778)"

This reverts commit 5ac674e6980f061e2f8114b358a0c3934e8945e1.
---
 .../__tests__/__snapshots__/demo.test.js.snap |  12 -
 components/form/FormItem.tsx                  |  17 -
 .../__tests__/__snapshots__/demo.test.js.snap | 420 ------------------
 components/form/demo/form-in-modal.md         |   7 +-
 components/form/style/index.less              |  34 +-
 .../__tests__/__snapshots__/demo.test.js.snap |  12 -
 .../__tests__/__snapshots__/demo.test.js.snap |  66 ---
 7 files changed, 26 insertions(+), 542 deletions(-)

diff --git a/components/comment/__tests__/__snapshots__/demo.test.js.snap b/components/comment/__tests__/__snapshots__/demo.test.js.snap
index 45fa4c2fdb..a361426711 100644
--- a/components/comment/__tests__/__snapshots__/demo.test.js.snap
+++ b/components/comment/__tests__/__snapshots__/demo.test.js.snap
@@ -164,12 +164,6 @@ exports[`renders ./components/comment/demo/editor.md correctly 1`] = `
                       rows="4"
                     />
                   </span>
-                  <div
-                    aria-hidden="true"
-                    class="ant-form-explain-holder"
-                  >
-                     
-                  </div>
                 </div>
               </div>
             </div>
@@ -194,12 +188,6 @@ exports[`renders ./components/comment/demo/editor.md correctly 1`] = `
                       </span>
                     </button>
                   </span>
-                  <div
-                    aria-hidden="true"
-                    class="ant-form-explain-holder"
-                  >
-                     
-                  </div>
                 </div>
               </div>
             </div>
diff --git a/components/form/FormItem.tsx b/components/form/FormItem.tsx
index 89fd809f12..e0e4a1ed83 100644
--- a/components/form/FormItem.tsx
+++ b/components/form/FormItem.tsx
@@ -164,7 +164,6 @@ export default class FormItem extends React.Component<FormItemProps, any> {
     if (children) {
       this.helpShow = !!children;
     }
-
     return (
       <Animate
         transitionName="show-help"
@@ -178,19 +177,6 @@ export default class FormItem extends React.Component<FormItemProps, any> {
     );
   }
 
-  renderHelpHolder(prefixCls: string) {
-    const { style } = this.props;
-    if (this.helpShow || (style && ('margin' in style || 'marginBottom' in style))) {
-      return null;
-    }
-
-    return (
-      <div className={`${prefixCls}-explain-holder`} aria-hidden="true">
-        {'\u00A0'}
-      </div>
-    );
-  }
-
   renderExtra(prefixCls: string) {
     const { extra } = this.props;
     return extra ? <div className={`${prefixCls}-extra`}>{extra}</div> : null;
@@ -220,7 +206,6 @@ export default class FormItem extends React.Component<FormItemProps, any> {
     c1: React.ReactNode,
     c2: React.ReactNode,
     c3: React.ReactNode,
-    helperHolder: React.ReactNode,
   ) {
     const props = this.props;
     const onlyControl = this.getOnlyControl;
@@ -274,7 +259,6 @@ export default class FormItem extends React.Component<FormItemProps, any> {
         </span>
         {c2}
         {c3}
-        {helperHolder}
       </div>
     );
   }
@@ -378,7 +362,6 @@ export default class FormItem extends React.Component<FormItemProps, any> {
           children,
           this.renderHelp(prefixCls),
           this.renderExtra(prefixCls),
-          this.renderHelpHolder(prefixCls),
         ),
       ),
     ];
diff --git a/components/form/__tests__/__snapshots__/demo.test.js.snap b/components/form/__tests__/__snapshots__/demo.test.js.snap
index e95bb0e699..bda91a61c5 100644
--- a/components/form/__tests__/__snapshots__/demo.test.js.snap
+++ b/components/form/__tests__/__snapshots__/demo.test.js.snap
@@ -46,12 +46,6 @@ exports[`renders ./components/form/demo/advanced-search.md correctly 1`] = `
                   value=""
                 />
               </span>
-              <div
-                aria-hidden="true"
-                class="ant-form-explain-holder"
-              >
-                 
-              </div>
             </div>
           </div>
         </div>
@@ -93,12 +87,6 @@ exports[`renders ./components/form/demo/advanced-search.md correctly 1`] = `
                   value=""
                 />
               </span>
-              <div
-                aria-hidden="true"
-                class="ant-form-explain-holder"
-              >
-                 
-              </div>
             </div>
           </div>
         </div>
@@ -140,12 +128,6 @@ exports[`renders ./components/form/demo/advanced-search.md correctly 1`] = `
                   value=""
                 />
               </span>
-              <div
-                aria-hidden="true"
-                class="ant-form-explain-holder"
-              >
-                 
-              </div>
             </div>
           </div>
         </div>
@@ -187,12 +169,6 @@ exports[`renders ./components/form/demo/advanced-search.md correctly 1`] = `
                   value=""
                 />
               </span>
-              <div
-                aria-hidden="true"
-                class="ant-form-explain-holder"
-              >
-                 
-              </div>
             </div>
           </div>
         </div>
@@ -234,12 +210,6 @@ exports[`renders ./components/form/demo/advanced-search.md correctly 1`] = `
                   value=""
                 />
               </span>
-              <div
-                aria-hidden="true"
-                class="ant-form-explain-holder"
-              >
-                 
-              </div>
             </div>
           </div>
         </div>
@@ -281,12 +251,6 @@ exports[`renders ./components/form/demo/advanced-search.md correctly 1`] = `
                   value=""
                 />
               </span>
-              <div
-                aria-hidden="true"
-                class="ant-form-explain-holder"
-              >
-                 
-              </div>
             </div>
           </div>
         </div>
@@ -328,12 +292,6 @@ exports[`renders ./components/form/demo/advanced-search.md correctly 1`] = `
                   value=""
                 />
               </span>
-              <div
-                aria-hidden="true"
-                class="ant-form-explain-holder"
-              >
-                 
-              </div>
             </div>
           </div>
         </div>
@@ -375,12 +333,6 @@ exports[`renders ./components/form/demo/advanced-search.md correctly 1`] = `
                   value=""
                 />
               </span>
-              <div
-                aria-hidden="true"
-                class="ant-form-explain-holder"
-              >
-                 
-              </div>
             </div>
           </div>
         </div>
@@ -422,12 +374,6 @@ exports[`renders ./components/form/demo/advanced-search.md correctly 1`] = `
                   value=""
                 />
               </span>
-              <div
-                aria-hidden="true"
-                class="ant-form-explain-holder"
-              >
-                 
-              </div>
             </div>
           </div>
         </div>
@@ -469,12 +415,6 @@ exports[`renders ./components/form/demo/advanced-search.md correctly 1`] = `
                   value=""
                 />
               </span>
-              <div
-                aria-hidden="true"
-                class="ant-form-explain-holder"
-              >
-                 
-              </div>
             </div>
           </div>
         </div>
@@ -574,12 +514,6 @@ exports[`renders ./components/form/demo/coordinated.md correctly 1`] = `
             value=""
           />
         </span>
-        <div
-          aria-hidden="true"
-          class="ant-form-explain-holder"
-        >
-           
-        </div>
       </div>
     </div>
   </div>
@@ -660,12 +594,6 @@ exports[`renders ./components/form/demo/coordinated.md correctly 1`] = `
             </div>
           </div>
         </span>
-        <div
-          aria-hidden="true"
-          class="ant-form-explain-holder"
-        >
-           
-        </div>
       </div>
     </div>
   </div>
@@ -690,12 +618,6 @@ exports[`renders ./components/form/demo/coordinated.md correctly 1`] = `
             </span>
           </button>
         </span>
-        <div
-          aria-hidden="true"
-          class="ant-form-explain-holder"
-        >
-           
-        </div>
       </div>
     </div>
   </div>
@@ -789,12 +711,6 @@ exports[`renders ./components/form/demo/customized-form-controls.md correctly 1`
             </div>
           </span>
         </span>
-        <div
-          aria-hidden="true"
-          class="ant-form-explain-holder"
-        >
-           
-        </div>
       </div>
     </div>
   </div>
@@ -819,12 +735,6 @@ exports[`renders ./components/form/demo/customized-form-controls.md correctly 1`
             </span>
           </button>
         </span>
-        <div
-          aria-hidden="true"
-          class="ant-form-explain-holder"
-        >
-           
-        </div>
       </div>
     </div>
   </div>
@@ -875,12 +785,6 @@ exports[`renders ./components/form/demo/dynamic-form-item.md correctly 1`] = `
             </span>
           </button>
         </span>
-        <div
-          aria-hidden="true"
-          class="ant-form-explain-holder"
-        >
-           
-        </div>
       </div>
     </div>
   </div>
@@ -905,12 +809,6 @@ exports[`renders ./components/form/demo/dynamic-form-item.md correctly 1`] = `
             </span>
           </button>
         </span>
-        <div
-          aria-hidden="true"
-          class="ant-form-explain-holder"
-        >
-           
-        </div>
       </div>
     </div>
   </div>
@@ -952,12 +850,6 @@ exports[`renders ./components/form/demo/dynamic-rule.md correctly 1`] = `
             value=""
           />
         </span>
-        <div
-          aria-hidden="true"
-          class="ant-form-explain-holder"
-        >
-           
-        </div>
       </div>
     </div>
   </div>
@@ -994,12 +886,6 @@ exports[`renders ./components/form/demo/dynamic-rule.md correctly 1`] = `
             value=""
           />
         </span>
-        <div
-          aria-hidden="true"
-          class="ant-form-explain-holder"
-        >
-           
-        </div>
       </div>
     </div>
   </div>
@@ -1034,12 +920,6 @@ exports[`renders ./components/form/demo/dynamic-rule.md correctly 1`] = `
             </span>
           </label>
         </span>
-        <div
-          aria-hidden="true"
-          class="ant-form-explain-holder"
-        >
-           
-        </div>
       </div>
     </div>
   </div>
@@ -1064,12 +944,6 @@ exports[`renders ./components/form/demo/dynamic-rule.md correctly 1`] = `
             </span>
           </button>
         </span>
-        <div
-          aria-hidden="true"
-          class="ant-form-explain-holder"
-        >
-           
-        </div>
       </div>
     </div>
   </div>
@@ -1126,12 +1000,6 @@ exports[`renders ./components/form/demo/global-state.md correctly 1`] = `
               value="benjycui"
             />
           </span>
-          <div
-            aria-hidden="true"
-            class="ant-form-explain-holder"
-          >
-             
-          </div>
         </div>
       </div>
     </div>
@@ -1201,12 +1069,6 @@ exports[`renders ./components/form/demo/horizontal-login.md correctly 1`] = `
             />
           </span>
         </span>
-        <div
-          aria-hidden="true"
-          class="ant-form-explain-holder"
-        >
-           
-        </div>
       </div>
     </div>
   </div>
@@ -1259,12 +1121,6 @@ exports[`renders ./components/form/demo/horizontal-login.md correctly 1`] = `
             />
           </span>
         </span>
-        <div
-          aria-hidden="true"
-          class="ant-form-explain-holder"
-        >
-           
-        </div>
       </div>
     </div>
   </div>
@@ -1289,12 +1145,6 @@ exports[`renders ./components/form/demo/horizontal-login.md correctly 1`] = `
             </span>
           </button>
         </span>
-        <div
-          aria-hidden="true"
-          class="ant-form-explain-holder"
-        >
-           
-        </div>
       </div>
     </div>
   </div>
@@ -1391,12 +1241,6 @@ exports[`renders ./components/form/demo/layout.md correctly 1`] = `
               </label>
             </div>
           </span>
-          <div
-            aria-hidden="true"
-            class="ant-form-explain-holder"
-          >
-             
-          </div>
         </div>
       </div>
     </div>
@@ -1429,12 +1273,6 @@ exports[`renders ./components/form/demo/layout.md correctly 1`] = `
               value=""
             />
           </span>
-          <div
-            aria-hidden="true"
-            class="ant-form-explain-holder"
-          >
-             
-          </div>
         </div>
       </div>
     </div>
@@ -1467,12 +1305,6 @@ exports[`renders ./components/form/demo/layout.md correctly 1`] = `
               value=""
             />
           </span>
-          <div
-            aria-hidden="true"
-            class="ant-form-explain-holder"
-          >
-             
-          </div>
         </div>
       </div>
     </div>
@@ -1497,12 +1329,6 @@ exports[`renders ./components/form/demo/layout.md correctly 1`] = `
               </span>
             </button>
           </span>
-          <div
-            aria-hidden="true"
-            class="ant-form-explain-holder"
-          >
-             
-          </div>
         </div>
       </div>
     </div>
@@ -1563,12 +1389,6 @@ exports[`renders ./components/form/demo/normal-login.md correctly 1`] = `
             />
           </span>
         </span>
-        <div
-          aria-hidden="true"
-          class="ant-form-explain-holder"
-        >
-           
-        </div>
       </div>
     </div>
   </div>
@@ -1621,12 +1441,6 @@ exports[`renders ./components/form/demo/normal-login.md correctly 1`] = `
             />
           </span>
         </span>
-        <div
-          aria-hidden="true"
-          class="ant-form-explain-holder"
-        >
-           
-        </div>
       </div>
     </div>
   </div>
@@ -1685,12 +1499,6 @@ exports[`renders ./components/form/demo/normal-login.md correctly 1`] = `
             register now!
           </a>
         </span>
-        <div
-          aria-hidden="true"
-          class="ant-form-explain-holder"
-        >
-           
-        </div>
       </div>
     </div>
   </div>
@@ -1733,12 +1541,6 @@ exports[`renders ./components/form/demo/register.md correctly 1`] = `
             value=""
           />
         </span>
-        <div
-          aria-hidden="true"
-          class="ant-form-explain-holder"
-        >
-           
-        </div>
       </div>
     </div>
   </div>
@@ -1774,12 +1576,6 @@ exports[`renders ./components/form/demo/register.md correctly 1`] = `
             value=""
           />
         </span>
-        <div
-          aria-hidden="true"
-          class="ant-form-explain-holder"
-        >
-           
-        </div>
       </div>
     </div>
   </div>
@@ -1815,12 +1611,6 @@ exports[`renders ./components/form/demo/register.md correctly 1`] = `
             value=""
           />
         </span>
-        <div
-          aria-hidden="true"
-          class="ant-form-explain-holder"
-        >
-           
-        </div>
       </div>
     </div>
   </div>
@@ -1879,12 +1669,6 @@ exports[`renders ./components/form/demo/register.md correctly 1`] = `
             value=""
           />
         </span>
-        <div
-          aria-hidden="true"
-          class="ant-form-explain-holder"
-        >
-           
-        </div>
       </div>
     </div>
   </div>
@@ -1969,12 +1753,6 @@ exports[`renders ./components/form/demo/register.md correctly 1`] = `
             </i>
           </span>
         </span>
-        <div
-          aria-hidden="true"
-          class="ant-form-explain-holder"
-        >
-           
-        </div>
       </div>
     </div>
   </div>
@@ -2077,12 +1855,6 @@ exports[`renders ./components/form/demo/register.md correctly 1`] = `
             </span>
           </span>
         </span>
-        <div
-          aria-hidden="true"
-          class="ant-form-explain-holder"
-        >
-           
-        </div>
       </div>
     </div>
   </div>
@@ -2182,12 +1954,6 @@ exports[`renders ./components/form/demo/register.md correctly 1`] = `
             </div>
           </div>
         </span>
-        <div
-          aria-hidden="true"
-          class="ant-form-explain-holder"
-        >
-           
-        </div>
       </div>
     </div>
   </div>
@@ -2251,12 +2017,6 @@ exports[`renders ./components/form/demo/register.md correctly 1`] = `
         >
           We must make sure that your are a human.
         </div>
-        <div
-          aria-hidden="true"
-          class="ant-form-explain-holder"
-        >
-           
-        </div>
       </div>
     </div>
   </div>
@@ -2299,12 +2059,6 @@ exports[`renders ./components/form/demo/register.md correctly 1`] = `
             </span>
           </label>
         </span>
-        <div
-          aria-hidden="true"
-          class="ant-form-explain-holder"
-        >
-           
-        </div>
       </div>
     </div>
   </div>
@@ -2329,12 +2083,6 @@ exports[`renders ./components/form/demo/register.md correctly 1`] = `
             </span>
           </button>
         </span>
-        <div
-          aria-hidden="true"
-          class="ant-form-explain-holder"
-        >
-           
-        </div>
       </div>
     </div>
   </div>
@@ -2400,12 +2148,6 @@ exports[`renders ./components/form/demo/time-related-controls.md correctly 1`] =
             </div>
           </span>
         </span>
-        <div
-          aria-hidden="true"
-          class="ant-form-explain-holder"
-        >
-           
-        </div>
       </div>
     </div>
   </div>
@@ -2465,12 +2207,6 @@ exports[`renders ./components/form/demo/time-related-controls.md correctly 1`] =
             </div>
           </span>
         </span>
-        <div
-          aria-hidden="true"
-          class="ant-form-explain-holder"
-        >
-           
-        </div>
       </div>
     </div>
   </div>
@@ -2529,12 +2265,6 @@ exports[`renders ./components/form/demo/time-related-controls.md correctly 1`] =
             </div>
           </span>
         </span>
-        <div
-          aria-hidden="true"
-          class="ant-form-explain-holder"
-        >
-           
-        </div>
       </div>
     </div>
   </div>
@@ -2609,12 +2339,6 @@ exports[`renders ./components/form/demo/time-related-controls.md correctly 1`] =
             </span>
           </span>
         </span>
-        <div
-          aria-hidden="true"
-          class="ant-form-explain-holder"
-        >
-           
-        </div>
       </div>
     </div>
   </div>
@@ -2690,12 +2414,6 @@ exports[`renders ./components/form/demo/time-related-controls.md correctly 1`] =
             </span>
           </span>
         </span>
-        <div
-          aria-hidden="true"
-          class="ant-form-explain-holder"
-        >
-           
-        </div>
       </div>
     </div>
   </div>
@@ -2759,12 +2477,6 @@ exports[`renders ./components/form/demo/time-related-controls.md correctly 1`] =
             </span>
           </span>
         </span>
-        <div
-          aria-hidden="true"
-          class="ant-form-explain-holder"
-        >
-           
-        </div>
       </div>
     </div>
   </div>
@@ -2789,12 +2501,6 @@ exports[`renders ./components/form/demo/time-related-controls.md correctly 1`] =
             </span>
           </button>
         </span>
-        <div
-          aria-hidden="true"
-          class="ant-form-explain-holder"
-        >
-           
-        </div>
       </div>
     </div>
   </div>
@@ -2833,12 +2539,6 @@ exports[`renders ./components/form/demo/validate-other.md correctly 1`] = `
             China
           </span>
         </span>
-        <div
-          aria-hidden="true"
-          class="ant-form-explain-holder"
-        >
-           
-        </div>
       </div>
     </div>
   </div>
@@ -2919,12 +2619,6 @@ exports[`renders ./components/form/demo/validate-other.md correctly 1`] = `
             </div>
           </div>
         </span>
-        <div
-          aria-hidden="true"
-          class="ant-form-explain-holder"
-        >
-           
-        </div>
       </div>
     </div>
   </div>
@@ -3001,12 +2695,6 @@ exports[`renders ./components/form/demo/validate-other.md correctly 1`] = `
             </div>
           </div>
         </span>
-        <div
-          aria-hidden="true"
-          class="ant-form-explain-holder"
-        >
-           
-        </div>
       </div>
     </div>
   </div>
@@ -3118,12 +2806,6 @@ exports[`renders ./components/form/demo/validate-other.md correctly 1`] = `
              machines
           </span>
         </span>
-        <div
-          aria-hidden="true"
-          class="ant-form-explain-holder"
-        >
-           
-        </div>
       </div>
     </div>
   </div>
@@ -3164,12 +2846,6 @@ exports[`renders ./components/form/demo/validate-other.md correctly 1`] = `
             />
           </button>
         </span>
-        <div
-          aria-hidden="true"
-          class="ant-form-explain-holder"
-        >
-           
-        </div>
       </div>
     </div>
   </div>
@@ -3286,12 +2962,6 @@ exports[`renders ./components/form/demo/validate-other.md correctly 1`] = `
             </div>
           </div>
         </span>
-        <div
-          aria-hidden="true"
-          class="ant-form-explain-holder"
-        >
-           
-        </div>
       </div>
     </div>
   </div>
@@ -3381,12 +3051,6 @@ exports[`renders ./components/form/demo/validate-other.md correctly 1`] = `
             </label>
           </div>
         </span>
-        <div
-          aria-hidden="true"
-          class="ant-form-explain-holder"
-        >
-           
-        </div>
       </div>
     </div>
   </div>
@@ -3476,12 +3140,6 @@ exports[`renders ./components/form/demo/validate-other.md correctly 1`] = `
             </label>
           </div>
         </span>
-        <div
-          aria-hidden="true"
-          class="ant-form-explain-holder"
-        >
-           
-        </div>
       </div>
     </div>
   </div>
@@ -3639,12 +3297,6 @@ exports[`renders ./components/form/demo/validate-other.md correctly 1`] = `
             </div>
           </div>
         </span>
-        <div
-          aria-hidden="true"
-          class="ant-form-explain-holder"
-        >
-           
-        </div>
       </div>
     </div>
   </div>
@@ -3958,12 +3610,6 @@ exports[`renders ./components/form/demo/validate-other.md correctly 1`] = `
             </li>
           </ul>
         </span>
-        <div
-          aria-hidden="true"
-          class="ant-form-explain-holder"
-        >
-           
-        </div>
       </div>
     </div>
   </div>
@@ -4006,12 +3652,6 @@ exports[`renders ./components/form/demo/validate-other.md correctly 1`] = `
         >
           longgggggggggggggggggggggggggggggggggg
         </div>
-        <div
-          aria-hidden="true"
-          class="ant-form-explain-holder"
-        >
-           
-        </div>
       </div>
     </div>
   </div>
@@ -4053,12 +3693,6 @@ exports[`renders ./components/form/demo/validate-other.md correctly 1`] = `
             </span>
           </div>
         </span>
-        <div
-          aria-hidden="true"
-          class="ant-form-explain-holder"
-        >
-           
-        </div>
       </div>
     </div>
   </div>
@@ -4083,12 +3717,6 @@ exports[`renders ./components/form/demo/validate-other.md correctly 1`] = `
             </span>
           </button>
         </span>
-        <div
-          aria-hidden="true"
-          class="ant-form-explain-holder"
-        >
-           
-        </div>
       </div>
     </div>
   </div>
@@ -4167,12 +3795,6 @@ exports[`renders ./components/form/demo/validate-static.md correctly 1`] = `
             value=""
           />
         </span>
-        <div
-          aria-hidden="true"
-          class="ant-form-explain-holder"
-        >
-           
-        </div>
       </div>
     </div>
   </div>
@@ -4288,12 +3910,6 @@ exports[`renders ./components/form/demo/validate-static.md correctly 1`] = `
             </i>
           </span>
         </span>
-        <div
-          aria-hidden="true"
-          class="ant-form-explain-holder"
-        >
-           
-        </div>
       </div>
     </div>
   </div>
@@ -4349,12 +3965,6 @@ exports[`renders ./components/form/demo/validate-static.md correctly 1`] = `
             </i>
           </span>
         </span>
-        <div
-          aria-hidden="true"
-          class="ant-form-explain-holder"
-        >
-           
-        </div>
       </div>
     </div>
   </div>
@@ -4494,12 +4104,6 @@ exports[`renders ./components/form/demo/validate-static.md correctly 1`] = `
             </i>
           </span>
         </span>
-        <div
-          aria-hidden="true"
-          class="ant-form-explain-holder"
-        >
-           
-        </div>
       </div>
     </div>
   </div>
@@ -4585,12 +4189,6 @@ exports[`renders ./components/form/demo/validate-static.md correctly 1`] = `
             </i>
           </span>
         </span>
-        <div
-          aria-hidden="true"
-          class="ant-form-explain-holder"
-        >
-           
-        </div>
       </div>
     </div>
   </div>
@@ -4689,12 +4287,6 @@ exports[`renders ./components/form/demo/validate-static.md correctly 1`] = `
             </i>
           </span>
         </span>
-        <div
-          aria-hidden="true"
-          class="ant-form-explain-holder"
-        >
-           
-        </div>
       </div>
     </div>
   </div>
@@ -4927,12 +4519,6 @@ exports[`renders ./components/form/demo/validate-static.md correctly 1`] = `
                     </div>
                   </span>
                 </span>
-                <div
-                  aria-hidden="true"
-                  class="ant-form-explain-holder"
-                >
-                   
-                </div>
               </div>
             </div>
           </div>
@@ -5059,12 +4645,6 @@ exports[`renders ./components/form/demo/validate-static.md correctly 1`] = `
             </i>
           </span>
         </span>
-        <div
-          aria-hidden="true"
-          class="ant-form-explain-holder"
-        >
-           
-        </div>
       </div>
     </div>
   </div>
diff --git a/components/form/demo/form-in-modal.md b/components/form/demo/form-in-modal.md
index 3ac7595fd0..b23cb3cdb9 100644
--- a/components/form/demo/form-in-modal.md
+++ b/components/form/demo/form-in-modal.md
@@ -45,7 +45,7 @@ const CollectionCreateForm = Form.create({ name: 'form_in_modal' })(
             <Form.Item label="Description">
               {getFieldDecorator('description')(<Input type="textarea" />)}
             </Form.Item>
-            <Form.Item style={{ marginBottom: 0 }}>
+            <Form.Item className="collection-create-form_last-form-item">
               {getFieldDecorator('modifier', {
                 initialValue: 'public',
               })(
@@ -110,3 +110,8 @@ class CollectionsPage extends React.Component {
 ReactDOM.render(<CollectionsPage />, mountNode);
 ````
 
+````css
+.collection-create-form_last-form-item {
+  margin-bottom: 0;
+}
+````
diff --git a/components/form/style/index.less b/components/form/style/index.less
index 64fc3c3b80..9a1b419afd 100644
--- a/components/form/style/index.less
+++ b/components/form/style/index.less
@@ -71,8 +71,7 @@ input[type='checkbox'] {
   }
 
   .reset-component;
-  margin-bottom: @form-item-margin-bottom - @font-size-base * @line-height-base -
-    @form-help-margin-top;
+  margin-bottom: @form-item-margin-bottom;
   vertical-align: top;
 
   &-control {
@@ -85,6 +84,11 @@ input[type='checkbox'] {
     position: relative;
   }
 
+  &-with-help {
+    margin-bottom: @form-item-margin-bottom - @font-size-base * @line-height-base -
+      @form-help-margin-top;
+  }
+
   &-label {
     display: inline-block;
     overflow: hidden;
@@ -119,23 +123,14 @@ input[type='checkbox'] {
   }
 }
 
-.@{form-prefix-cls}-explain-holder {
-  width: 0;
-  margin-top: @form-help-margin-top;
-  line-height: @line-height-base;
-  pointer-events: none;
-
-  .@{form-prefix-cls}-inline & {
-    display: none;
-  }
-}
-
 .@{form-prefix-cls}-explain,
 .@{form-prefix-cls}-extra {
   clear: both;
   margin-top: @form-help-margin-top;
   color: @text-color-secondary;
-  line-height: @line-height-base;
+  // Magic tweak pixel number to float line-height diff in windows
+  // Fix https://github.com/ant-design/ant-design/issues/12803
+  line-height: @line-height-base + 0.024;
   transition: color 0.3s @ease-out; // sync input color transition
 }
 
@@ -592,6 +587,17 @@ form {
   }
 }
 
+.@{ant-prefix}-advanced-search-form {
+  .@{form-prefix-cls}-item {
+    margin-bottom: @form-item-margin-bottom;
+
+    &-with-help {
+      margin-bottom: @form-item-margin-bottom - @font-size-base * @line-height-base -
+        @form-help-margin-top;
+    }
+  }
+}
+
 .show-help-motion(@className, @keyframeName, @duration: @animation-duration-slow) {
   .make-motion(@className, @keyframeName, @duration);
   .@{className}-enter,
diff --git a/components/mention/__tests__/__snapshots__/demo.test.js.snap b/components/mention/__tests__/__snapshots__/demo.test.js.snap
index 25f6099468..0357b91d8f 100644
--- a/components/mention/__tests__/__snapshots__/demo.test.js.snap
+++ b/components/mention/__tests__/__snapshots__/demo.test.js.snap
@@ -336,12 +336,6 @@ exports[`renders ./components/mention/demo/controlled.md correctly 1`] = `
             </div>
           </div>
         </span>
-        <div
-          aria-hidden="true"
-          class="ant-form-explain-holder"
-        >
-           
-        </div>
       </div>
     </div>
   </div>
@@ -375,12 +369,6 @@ exports[`renders ./components/mention/demo/controlled.md correctly 1`] = `
             </span>
           </button>
         </span>
-        <div
-          aria-hidden="true"
-          class="ant-form-explain-holder"
-        >
-           
-        </div>
       </div>
     </div>
   </div>
diff --git a/components/table/__tests__/__snapshots__/demo.test.js.snap b/components/table/__tests__/__snapshots__/demo.test.js.snap
index 8cdd7cc723..0d3ee743e0 100755
--- a/components/table/__tests__/__snapshots__/demo.test.js.snap
+++ b/components/table/__tests__/__snapshots__/demo.test.js.snap
@@ -1582,12 +1582,6 @@ exports[`renders ./components/table/demo/dynamic-settings.md correctly 1`] = `
                 />
               </button>
             </span>
-            <div
-              aria-hidden="true"
-              class="ant-form-explain-holder"
-            >
-               
-            </div>
           </div>
         </div>
       </div>
@@ -1624,12 +1618,6 @@ exports[`renders ./components/table/demo/dynamic-settings.md correctly 1`] = `
                 />
               </button>
             </span>
-            <div
-              aria-hidden="true"
-              class="ant-form-explain-holder"
-            >
-               
-            </div>
           </div>
         </div>
       </div>
@@ -1666,12 +1654,6 @@ exports[`renders ./components/table/demo/dynamic-settings.md correctly 1`] = `
                 />
               </button>
             </span>
-            <div
-              aria-hidden="true"
-              class="ant-form-explain-holder"
-            >
-               
-            </div>
           </div>
         </div>
       </div>
@@ -1709,12 +1691,6 @@ exports[`renders ./components/table/demo/dynamic-settings.md correctly 1`] = `
                 />
               </button>
             </span>
-            <div
-              aria-hidden="true"
-              class="ant-form-explain-holder"
-            >
-               
-            </div>
           </div>
         </div>
       </div>
@@ -1752,12 +1728,6 @@ exports[`renders ./components/table/demo/dynamic-settings.md correctly 1`] = `
                 />
               </button>
             </span>
-            <div
-              aria-hidden="true"
-              class="ant-form-explain-holder"
-            >
-               
-            </div>
           </div>
         </div>
       </div>
@@ -1795,12 +1765,6 @@ exports[`renders ./components/table/demo/dynamic-settings.md correctly 1`] = `
                 />
               </button>
             </span>
-            <div
-              aria-hidden="true"
-              class="ant-form-explain-holder"
-            >
-               
-            </div>
           </div>
         </div>
       </div>
@@ -1838,12 +1802,6 @@ exports[`renders ./components/table/demo/dynamic-settings.md correctly 1`] = `
                 />
               </button>
             </span>
-            <div
-              aria-hidden="true"
-              class="ant-form-explain-holder"
-            >
-               
-            </div>
           </div>
         </div>
       </div>
@@ -1880,12 +1838,6 @@ exports[`renders ./components/table/demo/dynamic-settings.md correctly 1`] = `
                 />
               </button>
             </span>
-            <div
-              aria-hidden="true"
-              class="ant-form-explain-holder"
-            >
-               
-            </div>
           </div>
         </div>
       </div>
@@ -1923,12 +1875,6 @@ exports[`renders ./components/table/demo/dynamic-settings.md correctly 1`] = `
                 />
               </button>
             </span>
-            <div
-              aria-hidden="true"
-              class="ant-form-explain-holder"
-            >
-               
-            </div>
           </div>
         </div>
       </div>
@@ -2017,12 +1963,6 @@ exports[`renders ./components/table/demo/dynamic-settings.md correctly 1`] = `
                 </label>
               </div>
             </span>
-            <div
-              aria-hidden="true"
-              class="ant-form-explain-holder"
-            >
-               
-            </div>
           </div>
         </div>
       </div>
@@ -2130,12 +2070,6 @@ exports[`renders ./components/table/demo/dynamic-settings.md correctly 1`] = `
                 </label>
               </div>
             </span>
-            <div
-              aria-hidden="true"
-              class="ant-form-explain-holder"
-            >
-               
-            </div>
           </div>
         </div>
       </div>