title: Remove whitespace above div in react app
body: <p>I have a problem where I have created a header component but there is still whitespace above the header on every page I pull the header component in</p>
  
  <p>this is my entire header component:</p>
  
  <pre><code>import React from 'react';
  import { Link } from 'react-router';
  import './index.scss';
  
  export default class Header extends React.Component {
  
    render() {
      return(
        &lt;div className="container"&gt;
          &lt;ul&gt;
            &lt;div className="links"&gt;
                &lt;li&gt;&lt;Link to="quizzes"&gt;Quizzes&lt;/Link&gt;&lt;/li&gt;
              &lt;/div&gt;
              &lt;div className="links"&gt;
                &lt;li&gt;&lt;Link to="categories"&gt;Categories&lt;/Link&gt;&lt;/li&gt;
              &lt;/div&gt;
              &lt;div className="links"&gt;
                &lt;li&gt;&lt;Link to="create"&gt;Create&lt;/Link&gt;&lt;/li&gt;
            &lt;/div&gt;
          &lt;/ul&gt;
        &lt;/div&gt;
      )
    }
  }
  </code></pre>
  
  <p>and this is my entire css</p>
  
  <pre><code>body {
    margin: 0;
  }
  .container {
    margin: 0;
    background-color: #bec0c4;
    height: 50px;
    width: 100%;
  }
  .container ul{
    display: flex;
    flex-direction: row;
    font-size: 20px;
    justify-content: space-between;
    list-style-type: none;
    width: 90%;
  }
  </code></pre>
  
  <p>I have seen many answers saying to set the margin to 0 but this is still giving me whitespace at the top. if i set margin-top to -20px, it removes it but i dont like this solution</p>