title: How to auto position my buttons on my website with different screen resolution?
body: <p>I am working on my website and new to it. I have lots of buttons in my website but there position changes when the screen resolution is minimized. I have also provided my CSS code. Please help me what to do to make my buttons positioned automatically with different screen resolution.</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>/* Set a style for the submit/send button */
  .form-container .btn{
    background-color: #009900;
    color: white;
    border: none;
    cursor: pointer;
    opacity: 0.8;
  }
  .form-container .send{
   margin-top: 38.5%;
   margin-right:-17.5%;
   padding: 5px 52px;
  }
  /* Add a red background color to the cancel button */
  .form-container .cancel {
    background-color: red;
    padding: 5px 10px;
    margin-top: -10px;
    margin-bottom: 6.5px;
    width: 48%;
  }</code></pre>
  </div>
  </div>
  </p>
  
  <p><a href="https://i.stack.imgur.com/TzrfI.png" rel="nofollow noreferrer">Click here to see the snapshot!</a></p>