diff --git a/client/src/components/Form/Input/Input.jsx b/client/src/components/Form/Input/Input.jsx
index 19a2aa7c0..504dbf424 100644
--- a/client/src/components/Form/Input/Input.jsx
+++ b/client/src/components/Form/Input/Input.jsx
@@ -3,7 +3,7 @@ import PropTypes from 'prop-types';
 
 const Input = props => {
   const { name, label, placeholder, error, noStyle, wrapperClass, inputClass, ...rest } = props;
-  let wrapperClassRender = 'form-group';
+  let wrapperClassRender = 'form-group row';
   let inputClassRender = 'col-sm-10';
   if (noStyle) {
     wrapperClassRender = '';
diff --git a/client/src/components/Form/Select/Select.jsx b/client/src/components/Form/Select/Select.jsx
index f375ba858..fc58b471e 100644
--- a/client/src/components/Form/Select/Select.jsx
+++ b/client/src/components/Form/Select/Select.jsx
@@ -3,7 +3,7 @@ import PropTypes from 'prop-types';
 
 const Select = ({ name, label, items, error, wrapperClass, selectClass, blankItem, ...rest }) => {
   return (
-    <div className={`${wrapperClass || 'form-group'}`}>
+    <div className={`${wrapperClass || 'form-group row'}`}>
       {label !== '' ? (
         <label htmlFor={name} className="col-sm-2 col-form-label">
           {label}
diff --git a/client/src/containers/Topic/TopicProduce/TopicProduce.jsx b/client/src/containers/Topic/TopicProduce/TopicProduce.jsx
index 37c0bf094..daf887757 100644
--- a/client/src/containers/Topic/TopicProduce/TopicProduce.jsx
+++ b/client/src/containers/Topic/TopicProduce/TopicProduce.jsx
@@ -203,7 +203,6 @@ class TopicProduce extends Form {
         <div className="row khq-multiple col-sm-7">
           {this.renderCheckbox(
             'isMultiMessage',
-            '',
             multiMessage,
             () => {
               this.setState({
@@ -247,7 +246,6 @@ class TopicProduce extends Form {
         <div className="row khq-multiple col-sm-7">
           {this.renderCheckbox(
             'isTombstone',
-            '',
             tombstone,
             () => {
               this.setState({ tombstone: !tombstone });
@@ -299,9 +297,9 @@ class TopicProduce extends Form {
               '',
               'Key',
               'text',
-              undefined,
               true,
-              'col-sm-6',
+              'col-sm-6 row',
+              'col-sm-12 p-0',
               'input-class'
             )}
 
@@ -310,9 +308,9 @@ class TopicProduce extends Form {
               '',
               'Value',
               'text',
-              undefined,
               true,
-              'col-sm-6',
+              'col-sm-6 row',
+              'col-sm-12 p-0',
               'input-class'
             )}
           </div>
@@ -441,7 +439,6 @@ class TopicProduce extends Form {
           <Header title={`Produce to ${topicId} `} />
           {this.renderDropdown(
             'Topic',
-            topics,
             topicsSearchValue,
             topicId,
             value => {
@@ -462,7 +459,6 @@ class TopicProduce extends Form {
           )}
           {this.renderDropdown(
             'Key schema',
-            keySchema.map(key => key.subject),
             keySchemaSearchValue,
             selectedKeySchema,
             value => {
@@ -495,7 +491,6 @@ class TopicProduce extends Form {
 
           {this.renderDropdown(
             'Value schema',
-            valueSchema.map(value => value.subject),
             valueSchemaSearchValue,
             selectedValueSchema,
             value => {