title: reach-router background-image not displaying correctly sometimes
body: <p>I've created a create-react-app project and I'm just starting to add routing to it now with reach-router. I have a simple TitleHeader component with a background-image that I use with the components for each of the routes. They mostly work, but  whenever I navigate to one in particular (DissectionGame), the background image doesn't appear and then after that, it doesn't appear for any of the other components either.</p>
  
  <p>Below are relevant snippets, though they really don't show the problem. At this level, all of the components are really the same and if I comment out the other nested components in the DissectionGame component, it works as well. Given that, I assume the problem has something to do with those components, but I just have no idea what to look at and what might affect the background-image in the TitleHeader component. </p>
  
  <p>Does anyone have any clues as to what might be happening? Can the path to the image somehow get stomped on and if so, how? I've only been working in React for a couple months now so it's all still pretty fresh. I'd appreciate any suggestions!</p>
  
  <pre><code>function App() {
  
    return (
      &lt;AppStyle&gt;
        &lt;HeaderNav /&gt;
  
        &lt;Router&gt;
          &lt;Home path="/" /&gt;
          &lt;Help path="help" /&gt;
          &lt;Games path="games" &gt;
            &lt;GamesInfo path="/" /&gt;
            &lt;DissectionGame path="dissection" /&gt;
          &lt;/Games&gt;
        &lt;/Router&gt;
      &lt;/AppStyle&gt;
    );
  }
  
  const HeaderBlock = styled.div`  
    background-image: url(./dark-paths.png);
    background-size: auto;
    font-family: 'Roboto', sans-serif;
    font-weight: 400;
    font-size: 24px;
    color: #c2d5db;
    padding: 15px 0px;
    margin: 5px 0px 10px;
  `;
  
  const TitleHeader = ({title}) =&gt; {
  
    return (
      &lt;HeaderBlock&gt;
        {title}
      &lt;/HeaderBlock&gt;
    )
  }
  
  const Home = () =&gt; {
  
    return (
      &lt;React.Fragment&gt;
        &lt;TitleHeader title="Welcome to Leading Step!" /&gt;
      &lt;/React.Fragment&gt;
    )
  }
  
  const DissectionGame = () =&gt; {
  
    return (
      &lt;React.Fragment&gt;
        &lt;TitleHeader title="Sentence Dissection" /&gt;
        /* Other game components... */
      &lt;/React.Fragment&gt;
    )
  }
  </code></pre>