title: Float left divs in IE7
body: <p>I have problem with IE7 and float left divs.</p>
  
  <p>here is css:</p>
  
  <pre><code>.h-slideshowcontrol  { display: block; float: left; width: 14px; height: 14px; }
  </code></pre>
  
  <p>And html:</p>
  
  <pre><code>&lt;div class="b-slideshowcontrols"&gt;
      &lt;div class="h-slideshowcontrol "&gt;
      &lt;/div&gt;
      &lt;div class="h-slideshowcontrol "&gt;
      &lt;/div&gt;
      &lt;div class="h-slideshowcontrol active"&gt;
      &lt;/div&gt;
      &lt;div class="h-slideshowcontrol "&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>I don't know why, but h-slideshowcontrol in IE7 is like without float left.</p>
  
  <p>P.S.
  You can see it on page - <a href="http://mindhouse.sitetd.ru/" rel="nofollow">http://mindhouse.sitetd.ru/</a> (rounded buttons under slideshow)</p>
  
  <p>Thanks for help!</p>
  
  <p>P.S.S.
  I fixed by adding outer block and changing styles to:</p>
  
  <pre><code>.b-slideshowcontrols_outer { 
      float:right;
      position:relative;
      left:-50%;
      text-align:left;
  }
  .b-slideshowcontrols { 
      position:relative;
      left:50%;
  }
  .h-slideshowcontrol { 
      float:left; white-space:nowrap; width:14px; height:14px; cursor:pointer; float: left; position:relative; margin-right: 2px;
      background:transparent url('../img/slideshowcontrol-inactive.png') no-repeat; 
  }
  </code></pre>