title: I have a problem when I click collapse button
body: <p>I have a problem. The view is like this :</p>
  
  <p><a href="https://i.stack.imgur.com/ev7cq.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/ev7cq.png" alt="enter image description here"></a></p>
  
  <p>When I click button see more the view is like this :</p>
  
  <p><a href="https://i.stack.imgur.com/TPfNz.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/TPfNz.png" alt="enter image description here"></a></p>
  
  <p>The problem is, I want the view is like this :</p>
  
  <p><a href="https://i.stack.imgur.com/po8Yg.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/po8Yg.png" alt="enter image description here"></a></p>
  
  <ul>
  <li>city beside state,</li>
  <li>country beside zip code </li>
  </ul>
  
  <p>How to fix this ? and what should I have to do ? </p>
  
  <pre><code>&lt;div class="row col-md-12 col-12 mb-20 collapse" id="registerform"&gt;
      &lt;div class="col-md-6 mb-20"&gt;
          &lt;label&gt;City&lt;/label&gt;
          &lt;input class="mb-0" type="text" name="city" placeholder="City" value="&lt;?= set_value('city'); ?&gt;"&gt;
          &lt;?= form_error('city', '&lt;small class="text-danger pl-2"&gt;', '&lt;/small&gt;'); ?&gt;
      &lt;/div&gt;
      &lt;div class="col-md-6 mb-20"&gt;
          &lt;label&gt;State&lt;/label&gt;
          &lt;input class="mb-0" type="text" name="province" placeholder="State" value="&lt;?= set_value('province'); ?&gt;"&gt;
          &lt;?= form_error('province', '&lt;small class="text-danger pl-2"&gt;', '&lt;/small&gt;'); ?&gt;
      &lt;/div&gt;
      &lt;div class="col-md-6 mb-20"&gt;
          &lt;label&gt;Country&lt;/label&gt;
          &lt;input class="mb-0" type="text" name="country" value="Indonesia" readonly&gt;
      &lt;/div&gt;
      &lt;div class="col-md-6 mb-20"&gt;
          &lt;label&gt;Zip Code&lt;/label&gt;
          &lt;input class="mb-0" type="text" name="zipcode" placeholder="Zipcode" value="&lt;?= set_value('zipcode'); ?&gt;"&gt;
          &lt;?= form_error('zipcode', '&lt;small class="text-danger pl-2"&gt;', '&lt;/small&gt;'); ?&gt;
      &lt;/div&gt;
      &lt;div class="col-md-6 mb-20"&gt;
          &lt;label&gt;Phone Number&lt;/label&gt;
          &lt;input class="mb-0" type="text" name="phonenumber" placeholder="Phone Number" value="&lt;?= set_value('phonenumber'); ?&gt;"&gt;
          &lt;?= form_error('phonenumber', '&lt;small class="text-danger pl-2"&gt;', '&lt;/small&gt;'); ?&gt;
      &lt;/div&gt;
  
      &lt;input class="mb-0" type="text" name="date_created" value="&lt;?= date('Y-m-d H:i:s');?&gt;" hidden&gt;
  
      &lt;div class="col-12"&gt;
          &lt;button type="submit" name="register" class="register-button mt-0"&gt;Register&lt;/button&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  
  &lt;a class="cokcok" data-toggle='collapse' href='#registerform' style="margin-left: 15px;"&gt;See more...&lt;/a&gt;
  </code></pre>