title: IE7 CSS div margin issue
body: <p>I have a minor CSS problem, but I'm having trouble fixing it because I don't have any computer handy with IE7 installed...</p>
  
  <p>In IE8, Chrome, FF, etc. I see this (correctly):</p>
  
  <p><img src="https://i.stack.imgur.com/j9OTs.png" alt="Should look like this..."></p>
  
  <p>but IE7 gives me this:</p>
  
  <p><img src="https://i.stack.imgur.com/ZcdqV.png" alt="IE7"></p>
  
  <p>the HTML code follows:</p>
  
  <pre><code>&lt;div id="hub"&gt;
      &lt;div class="title highlight"&gt;Faster, Cheaper, Better&lt;/div&gt;
      &lt;p&gt;PNMS...
  </code></pre>
  
  <p>the relevant CSS code follows:</p>
  
  <pre><code>#hub {} /* literally nothing */
  
  #hub div.title {
      font-size: 4em;
      font-style: italic;
      font-variant: small-caps;
      float: left;
      margin: 5px 0px 20px 0px;
      width: 940px; /* same as parent container */
  }
  
  .highlight { color: #ff6633;}
  
  p {
      text-indent: 30px;
      font-size: 1.3em;
      line-height: 1.1em;
      letter-spacing: 1px;
      margin: 5px;
  }
  </code></pre>
  
  <p>Based on visitor traffic, I need my site to be compatible with IE7 (thankfully NOT IE6). But again, guessing blindly and then running <code>browsershots.org</code> is not a very efficient manner.</p>
  
  <p>Can someone help? Thank you.</p>