title: Element outside container without creating scrollbars
body: <p>Can I make a banner reach outside of its container, without creating horizontal scrollbars if the window is too narrow?</p>
  
  <p>I thought I had done this before with negative margins, but can't get it to work now. </p>
  
  <p>Demo: <a href="http://jsfiddle.net/Znarkus/s95uz/" rel="noreferrer">http://jsfiddle.net/Znarkus/s95uz/</a></p>
  
  <pre><code>&lt;div id="main"&gt;
      &lt;div id="banner"&gt;I want this to not create a horizontal scrollbar, when the window/frame is too narrow.&lt;/div&gt;
      &lt;div id="content"&gt;
  
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>​</p>
  
  <p><img src="https://i.stack.imgur.com/bGdku.png" alt=""></p>