🐛 Fix hasFeedback overlap issue with Input.Password

close #16443

components/form/demo/register.md

@@ -148,6 +148,7 @@ class RegistrationForm extends React.Component {
         </Form.Item>
         <Form.Item
           label="Password"
+          hasFeedback
         >
           {getFieldDecorator('password', {
             rules: [{
@@ -156,11 +157,12 @@ class RegistrationForm extends React.Component {
               validator: this.validateToNextPassword,
             }],
           })(
-            <Input type="password" />
+            <Input.Password />
           )}
         </Form.Item>
         <Form.Item
           label="Confirm Password"
+          hasFeedback
         >
           {getFieldDecorator('confirm', {
             rules: [{
@@ -169,7 +171,7 @@ class RegistrationForm extends React.Component {
               validator: this.compareToFirstPassword,
             }],
           })(
-            <Input type="password" onBlur={this.handleConfirmBlur} />
+            <Input.Password onBlur={this.handleConfirmBlur} />
           )}
         </Form.Item>
         <Form.Item

components/form/style/index.less

@@ -163,13 +163,16 @@ input[type='checkbox'] {
   text-align: center;
 }
 
-// 表单下的输入框尺寸唯一: 大尺寸
 form {
   .has-feedback {
     .@{ant-prefix}-input {
       padding-right: 24px;
     }
 
+    .@{ant-prefix}-input-password-icon {
+      margin-right: 18px;
+    }
+
     // Fix overlapping between feedback icon and <Select>'s arrow.
     // https://github.com/ant-design/ant-design/issues/4431
     > .@{ant-prefix}-select .@{ant-prefix}-select-arrow,