diff --git a/scss/_variables.scss b/scss/_variables.scss
index b294441a6..f35c190ae 100644
--- a/scss/_variables.scss
+++ b/scss/_variables.scss
@@ -616,6 +616,7 @@ $Form--horizontal-label-widthLg: px2rem(200px) !default;
 
 $Form-control-widthXs: px2rem(80px) !default;
 $Form-control-widthSm: px2rem(160px) !default;
+$Form-control-widthBase: px2rem(200px) !default;
 $Form-control-widthMd: px2rem(240px) !default;
 $Form-control-widthLg: px2rem(320px) !default;
 
diff --git a/scss/components/form/_form.scss b/scss/components/form/_form.scss
index 7c7889086..8c9cdebef 100644
--- a/scss/components/form/_form.scss
+++ b/scss/components/form/_form.scss
@@ -112,28 +112,28 @@
   .#{$ns}Form-control--sizeXs {
     // min-width: $Form-control-widthXs;
     // width: auto;
-    width: $Form-control-widthXs;
+    min-width: $Form-control-widthXs;
     max-width: 100%;
     display: inline-block;
     vertical-align: top;
   }
 
   .#{$ns}Form-control--sizeSm {
-    width: $Form-control-widthSm;
+    min-width: $Form-control-widthSm;
     max-width: 100%;
     display: inline-block;
     vertical-align: top;
   }
 
   .#{$ns}Form-control--sizeMd {
-    width: $Form-control-widthMd;
+    min-width: $Form-control-widthMd;
     max-width: 100%;
     display: inline-block;
     vertical-align: top;
   }
 
   .#{$ns}Form-control--sizeLg {
-    width: $Form-control-widthLg;
+    min-width: $Form-control-widthLg;
     max-width: 100%;
     display: inline-block;
     vertical-align: top;
diff --git a/scss/components/form/_text.scss b/scss/components/form/_text.scss
index ae15b6fa6..b934306bd 100644
--- a/scss/components/form/_text.scss
+++ b/scss/components/form/_text.scss
@@ -19,6 +19,7 @@
 
 @mixin input-text {
   position: relative;
+  min-width: $Form-control-widthBase;
 
   &.is-inline {
     display: inline-block;
diff --git a/src/components/ColorPicker.tsx b/src/components/ColorPicker.tsx
index 8c214e39a..0d261cf62 100644
--- a/src/components/ColorPicker.tsx
+++ b/src/components/ColorPicker.tsx
@@ -234,10 +234,10 @@ export class ColorControl extends React.PureComponent<
         )}
       >
         <input
-          size={10}
           ref={this.input}
           type="text"
           autoComplete="off"
+          size={1}
           className={cx('ColorPicker-input')}
           value={this.state.inputValue || ''}
           placeholder={placeholder}
diff --git a/src/renderers/DropDownButton.tsx b/src/renderers/DropDownButton.tsx
index 0881e82a4..270fc2a97 100644
--- a/src/renderers/DropDownButton.tsx
+++ b/src/renderers/DropDownButton.tsx
@@ -27,7 +27,7 @@ export default class DropDownButton extends React.Component<
   DropDownButtonState
 > {
   state: DropDownButtonState = {
-    isOpened: this.props.defaultIsOpened || false
+    isOpened: false
   };
 
   static defaultProps = {
@@ -44,6 +44,14 @@ export default class DropDownButton extends React.Component<
     this.domRef = this.domRef.bind(this);
   }
 
+  componentDidMount() {
+    if (this.props.defaultIsOpened) {
+      this.setState({
+        isOpened: true
+      })
+    }
+  }
+
   domRef(ref: any) {
     this.target = ref;
   }
diff --git a/src/renderers/Form/IconPicker.tsx b/src/renderers/Form/IconPicker.tsx
index 040a7bd95..b32ccb5da 100644
--- a/src/renderers/Form/IconPicker.tsx
+++ b/src/renderers/Form/IconPicker.tsx
@@ -259,6 +259,7 @@ export default class IconPickerControl extends React.PureComponent<
                     value: this.state.inputValue
                   })}
                   autoComplete="off"
+                  size={1}
                 />
               </div>
               {isOpen ? (
diff --git a/src/renderers/Form/Text.tsx b/src/renderers/Form/Text.tsx
index 769be3e6e..093aa70e2 100644
--- a/src/renderers/Form/Text.tsx
+++ b/src/renderers/Form/Text.tsx
@@ -508,6 +508,7 @@ export default class TextControl extends React.PureComponent<
                     onKeyDown: this.handleKeyDown
                   })}
                   autoComplete="off"
+                  size={1}
                 />
               </div>
 
@@ -591,6 +592,7 @@ export default class TextControl extends React.PureComponent<
           onFocus={this.handleFocus}
           onBlur={this.handleBlur}
           autoComplete="off"
+          size={1}
           onChange={this.handleNormalInputChange}
           value={
             typeof value === 'undefined' || value === null
diff --git a/src/renderers/Form/TransferSelect.tsx b/src/renderers/Form/TransferSelect.tsx
index 23ce66300..0df0aee11 100644
--- a/src/renderers/Form/TransferSelect.tsx
+++ b/src/renderers/Form/TransferSelect.tsx
@@ -189,6 +189,7 @@ export class TransferSelect extends React.Component<
                 <input
                   placeholder={searchPlaceholder}
                   autoComplete="off"
+                  size={1}
                   value={this.state.keyword}
                   onChange={this.handleSearch}
                 />
@@ -290,6 +291,7 @@ export class TransferSelect extends React.Component<
                 <input
                   placeholder={searchPlaceholder}
                   autoComplete="off"
+                  size={1}
                   onChange={this.handleSearch}
                 />
                 <i className="fa fa-search" />