title: CSS width 100% cuts off on minimized window
body: <p>I have a website with the header bar colour width as 100%, but when it is bordered to the left of the screen, it cuts it off when I scroll across? </p>
  
  <p>Here is an example:</p>
  
  <p><img src="https://i.stack.imgur.com/6OJar.jpg" alt="full width works fine"></p>
  
  <p>But if it is a smaller window and scrolled across:</p>
  
  <p><img src="https://i.stack.imgur.com/W5Dlk.jpg" alt="scrollbar"></p>
  
  <p>How can I get the width to be 100% when the screen is halved like in the picture? </p>
  
  <p>Sorry for the bad explanation, I don't know how to explain it well. Hopefully the pictures will help.</p>
  
  <p>My css is:</p>
  
  <pre><code>Header{background-color: #58dede; width: 100%;}
  </code></pre>