title: Material-UI style buttons on the right
body: <p>How do you align buttons on the right using Material-UI's makeStyles function?</p>
  
  <p>I have tried using CSS's <code>margin-right: 0</code> tag, but there is an error using '-' with makeStyles.
  I renamed it as 'marginRight' and it still does not work. Also <code>mr: 0</code> is not valid either. (Using Material-UI's spacing).</p>
  
  <p>The code is trying to make the UI similar to stackOverflow's title layout.</p>
  
  <pre><code>import React from 'react';
  import { makeStyles } from "@material-ui/core/styles";
  import { Box, Button } from "@material-ui/core";
  
  const style = makeStyles({
    titleItemRight: {
      color: 'white',
      backgroundColor: 'blue',
      top: '50%',
      height: 30,
      align: 'right',
      position: 'relative',
      transform: 'translateY(-50%)',
    }
  });
  
  const App = () =&gt; {
    const classes = style();
  
    return (
      &lt;div&gt;
        &lt;Box className={classes.titleBar}&gt;
          &lt;Button variant='text' className={classes.titleItemRight}&gt;Sign In&lt;/Button&gt;
        &lt;/Box&gt;
      &lt;/div&gt;
    );
  };
  </code></pre>