title: Moving Button to the right
body: <p>I have an HTML Page with a CSS. I want to align some buttons to the right. Even though in the normal HTML pages without this CSS template, the button would move to the right, it does not work anymore. Same is the case for similar buttons on the page. Align to the center does not work either.</p>
  
  <p>This is what the page looks like:</p>
  
  <p><a href="https://i.stack.imgur.com/nrNAB.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/nrNAB.png" alt="enter image description here"></a></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>input.logout {
    width: 100px;
    padding: 7px;
    cursor: pointer;
    font-weight: bold;
    font-size: 80%;
    background: #3366cc;
    color: #fff;
    border: 1px solid #3366cc;
    border-radius: 10px;
  }
  
  input.logout:hover {
    color: #ffff;
    background: #000;
    border: 1px solid #fff;
  }</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;form align="right"&gt;
    &lt;input class="logout" type="button" value="Logout" onclick="window.location.href='logout.php'" /&gt;
  &lt;/form&gt;</code></pre>
  </div>
  </div>
  </p>