title: Full-width div with background color
body: <p>On this page: <a href="http://www.tff-bvba.be" rel="noreferrer">http://www.tff-bvba.be</a>, I need the grey background behind the picture to be full-width on all resolutions, and the text and picture to be centered on the screen. Everything works ok, except the fact that the background continues to the right, off the screen (scroll to the right, you'll see).</p>
  
  <p>I spent 2 hours looking for a solution but found none that worked for me... This is my code:</p>
  
  <p>HTML:</p>
  
  <pre><code>&lt;div class="wide"&gt;
  &lt;div class="odd"&gt;
  &lt;div class="homeimage"&gt;&lt;img src="http://www.tff-bvba.be/wp-content/uploads/2013/11/hugo-  home.png" alt="hugo-home" class="alignright size-full wp-image-1283" /&gt;&lt;/div&gt;
  &lt;div class="hometext"&gt;&lt;h1&gt;Slaag in je materiaalinnovatie&lt;/h1&gt;
  Plan je een complexe innovatie waarbij de &lt;b&gt;combinatie en vorm van materialen&lt;/b&gt; essentieel is? Missen je medewerkers &lt;i&gt;knowhow&lt;/i&gt; of heb je tijdelijk versterking nodig?&lt;br /&gt;&lt;br /&gt;TFF maximaliseert de slaagkans van je project door:
  &lt;ul&gt;
      &lt;li&gt;&lt;b&gt;35 jaar ervaring&lt;/b&gt; in slimme materiaalcombinaties&lt;/li&gt;
      &lt;li&gt;maximaal &lt;b&gt;draagvlak &lt;/b&gt;bij je medewerkers&lt;/li&gt;
      &lt;li&gt;bewezen expertise in&lt;b&gt; technieken en processen&lt;/b&gt;&lt;/li&gt;
  &lt;/ul&gt;
  &lt;a class="bttn" title="Slimme materiaalinnovatie" href="http://www.tff-bvba.be/materiaalinnovatie/"&gt;Ontdek ons aanbod&lt;/a&gt;
  &lt;/div&gt;
  &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>CSS:</p>
  
  <pre><code>.wide { 
      text-align:left;
      font-weight:bold;
      background:#ebebeb;
      margin-left:-100%;
      margin-right:-100%;
      margin-bottom: 60px;
      height: 465px;
      }
  
  .odd {
      background-color:#ebebeb;
      clear:both;
      width:900px;
      padding:40px 0 27px 0;
      margin: 0 auto;
      }
  
  .hometext {
      float: left;
      width: 500px;
  }
  
  .homeimage {
          margin-top: 0px;
      float: right;
  }
  </code></pre>
  
  <p>Thanks for your help, much appreciated!
  Stefaan</p>