title: how to align Button to the right of the window
body: <p>I am trying to align the login button to the Top right of the page.</p>
  <p>I have Logo on left corner of the page and need to keep Login button to top right. when I am trying to do with padding-left the alignment is changing when I see in another screen size.</p>
  <p>I am building this in React JS</p>
  <pre class="lang-html prettyprint-override"><code>   &lt;Box &gt;
    &lt;Grid className=&quot;custom-home__header&quot; &gt;
      &lt;Box padding={{ vertical: &quot;s&quot; }}&gt;
        &lt;Grid&gt;
          &lt;Box&gt;
            &lt;img
              className=&quot;photo&quot;
              src={image}
              alt=&quot; Logo&quot;
            /&gt;
          &lt;/Box&gt;
        &lt;/Grid&gt;
  
      &lt;/Box&gt;
  
      &lt;Box className=&quot;style&quot; padding={{ vertical: &quot;m&quot; }} &gt;
        &lt;Grid
          className=&quot;custom-home__header&quot; &gt;
          &lt;Box className=&quot;style&quot; &gt;
            &lt;Button className=&quot;style&quot;
              variant=&quot;primary&quot;
              onClick={(e) =&gt; {
                e.preventDefault();
                const {
                  REACT_APP_AUTH_URL,
                  REACT_APP_CLIENT_ID,
                } = process.env;
                const authUrl = new URL(
                  `${REACT_APP_AUTH_URL}/login` || &quot;&quot;
                );
                authUrl.searchParams.append(&quot;response_type&quot;, &quot;token&quot;);
                const stateValue = uuidv4();
                storeAccessTokenState(stateValue);
                authUrl.searchParams.append(&quot;state&quot;, stateValue);
                authUrl.searchParams.append(
                  &quot;client_id&quot;,
                  REACT_APP_CLIENT_ID || &quot;&quot;
                );
                authUrl.searchParams.append(
                  &quot;scope&quot;,
                  &quot;profile openid&quot;
                );
                authUrl.searchParams.append(
                  &quot;redirect_uri&quot;,
                  encodeURI(`${window.location.href}callback`)
                );
                window.location.href = authUrl.href;
              }}
            &gt;
              Login
            &lt;/Button&gt;
  
          &lt;/Box&gt;
  </code></pre>
  <p><strong>CSS :</strong></p>
  <pre class="lang-css prettyprint-override"><code>.custom-home__header {
    background-color: $color-background-home-header;
  }
  
  .login{
  padding-left: 620px;
  }
  </code></pre>
  <p>How can I do this?
  <a href="https://i.stack.imgur.com/FNQj7.png" rel="nofollow noreferrer">login screen</a></p>
  <p>please see <a href="https://i.stack.imgur.com/FNQj7.png" rel="nofollow noreferrer">the screen shot login screen</a>, I need to align login button to right corner</p>