fix bouncing help icons on mobiles devices

scm-ui-components/packages/ui-components/src/forms/Checkbox.js

@@ -10,7 +10,9 @@ type Props = {
   disabled?: boolean,
   helpText?: string
 };
+
 class Checkbox extends React.Component<Props> {
+
   onCheckboxChange = (event: SyntheticInputEvent<HTMLInputElement>) => {
     if (this.props.onChange) {
       this.props.onChange(event.target.checked, this.props.name);
@@ -20,12 +22,8 @@ class Checkbox extends React.Component<Props> {
   renderHelp = () => {
     const helpText = this.props.helpText;
     if (helpText) {
-      return (
-        <div className="control columns is-vcentered">
-          <Help message={helpText} />
-        </div>
-      );
-    } else return null;
+      return <Help message={helpText} />;
+    }
   };
 
   render() {
@@ -39,10 +37,11 @@ class Checkbox extends React.Component<Props> {
               onChange={this.onCheckboxChange}
               disabled={this.props.disabled}
             />
+            {" "}
             {this.props.label}
+            {this.renderHelp()}
           </label>
         </div>
-        {this.renderHelp()}
       </div>
     );
   }