title: Placing button under another div
body: <p>This is probably very simple but I've been unable to figure it out. All I want to do is place the button underneath the input rows. </p>
  
  <p>This is what I have attempted so far: </p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-css lang-css prettyprint-override"><code>#subscribe button {
    border: 0;
    margin-top: 10px;
    margin-left: 10px;
    padding: 9px 27px;
    cursor: pointer;
    background: #f82249;
    color: #fff;
    transition: all 0.3s ease;
    outline: none;
    font-size: 14px;
    border-radius: 50px;
    position: relative;
  }</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code> &lt;form method="POST" action="#"&gt;
            &lt;div class="form-row justify-content-center"&gt;
              &lt;div class="col-auto"&gt;
                &lt;input type="text" class="form-control" placeholder="Enter your email"&gt;
              &lt;/div&gt;
              &lt;div class="col-auto"&gt;
                &lt;input type="text" class="form-control" placeholder="A website I want to use Cobble on is:"&gt;
              &lt;/div&gt;
              &lt;div class="col-auto"&gt;
                &lt;button type="submit"&gt;Submit&lt;/button&gt;
              &lt;/div&gt;
            &lt;/div&gt;
          &lt;/form&gt;
        &lt;/div&gt;
        &lt;/div&gt;
        &lt;/div&gt;
      &lt;/section&gt;</code></pre>
  </div>
  </div>
  </p>
  
  <p>and this is what the end result always is: 
  <a href="https://i.stack.imgur.com/oRdeq.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/oRdeq.png" alt="enter image description here"></a></p>
  
  <p>Any help would be immensely appreciated. Thank you. </p>