title: I cannot center the Button component in Material-UI using Styled Components
body: <p>I am quite new to Material UI @ next, and I like the fact that it supports Styled Components. </p>
  
  <p>However, I am struggling in aligning the <strong>Button</strong> component to the center through Styled Components. I only manage to align it by using the <em>styles</em> technique such as this:</p>
  
  <pre><code>const styles = {
    container: {
      textAlign: "center"
    }
  };
  
  class Landing extends Component {
    render() {
      return (
      ...
      &lt;div style={styles.container}&gt;
        &lt;Button variant="raised" color="primary"&gt;
          I am a button
        &lt;/Button&gt;
      &lt;/div&gt;
      );
    }
  }
  </code></pre>
  
  <p>This is something that I like to avoid, and instead use the Styled Components such as:</p>
  
  <pre><code>const Container = styled.div`
    text-align: "center";
  `;
  </code></pre>
  
  <p>However, for some reason it is not working although they look exactly identical. Can someone explain whether text-align and textAlign are pointing to the same CSS property? </p>