diff --git a/ippisite/ippidb/static/css/admin-session.css b/ippisite/ippidb/static/css/admin-session.css
index 11e4a6602aad95fd312ec5021536a8dc35219a90..3068c3939696565a9b87125d0b9037d800d7db41 100644
--- a/ippisite/ippidb/static/css/admin-session.css
+++ b/ippisite/ippidb/static/css/admin-session.css
@@ -245,15 +245,6 @@ Description: IPPI-DB Theme
   padding-bottom: 1%;
 }
 
-.smiles-inpout-and-edit {
-  display: flex;
-}
-
-.smiles-inpout-and-edit>*:first-child {
-  flex: 1 auto;
-  margin-right: 0.5em;
-}
-
 .form-group.form-check, .compound .input_field input {
   text-align: left;
 }
@@ -1515,7 +1506,7 @@ Description: IPPI-DB Theme
   text-decoration: none;
 }
 
-[type="reset"], [type="submit"], button:not(.multiselect-native-select):not(.multiselect-clear-filter) {
+[type="reset"], [type="submit"], :not(.input-group-append)>button:not(.multiselect-native-select):not(.multiselect-clear-filter) {
   -webkit-appearance: button;
   margin-top: 5px;
   border-radius: 0px;
@@ -1524,6 +1515,13 @@ Description: IPPI-DB Theme
   color: #fff;
 }
 
+[type="reset"], [type="submit"], .input-group-append>button {
+  -webkit-appearance: button;
+  background-color: #2d96fa;
+  border: none;
+  color: #fff;
+}
+
 .add-button {
   border: none;
   color: initial;
diff --git a/ippisite/ippidb/templates/compound_form_content.html b/ippisite/ippidb/templates/compound_form_content.html
index b097a6b7058bbec94d9ccd67ba49d1d51ab4dfdd..327b4b9bc4c715212fde5f2777637f895d89f372 100644
--- a/ippisite/ippidb/templates/compound_form_content.html
+++ b/ippisite/ippidb/templates/compound_form_content.html
@@ -38,15 +38,20 @@
 <!--        {{ form.common_name|bootstrap }}-->
         {{ form.compound_name|bootstrap }}
         {{ form.is_macrocycle|bootstrap }}
-        <div class="form-group smiles-inpout-and-edit">
-            <div>
-                {{ form.molecule_smiles|bootstrap }}
-            </div>
-            <div>
-                <button class="btn btn-primary" onclick="showModalFromMe(this);return false;">
-                    <i class="fas fa-pencil-alt"></i>
-                </button>
-            </div>
+        <div class="input-group smiles-inpout-and-edit">
+          <textarea type="text"
+                 name="{{form.molecule_smiles.html_name}}"
+                 {%if form.molecule_smiles.value %}value="{{form.molecule_smiles.value}}"{%endif%}
+                 class="molecule-composition form-control"
+                 cols="40" rows="1"
+                 {%if form.fields.common_name.required %}required{%endif%}
+                 id="{{form.molecule_smiles.id_for_label}}"></textarea>
+            <label class="form-control-placeholder" for="{{form.molecule_smiles.id_for_label}}">
+                {{form.molecule_smiles.label}}
+            </label>
+          <div class="input-group-append">
+            <button class="btn btn-outline-secondary" onclick="showModalFromMe(this);return false;"><i class="fas fa-pencil-alt"></i></button>
+          </div>
         </div>
         {{ form.molecule_iupac|bootstrap }}