title: CSS floated div, not shrinking to content
body: <p>This is very odd to me, and although I've searched, everyone seems to have the opposite problem to me (a floated div shrinking)!</p>
  
  <p>I have this page: <a href="http://www.tameside.gov.uk/test/news" rel="nofollow">http://www.tameside.gov.uk/test/news</a>, which uses PHP to generate the divs at the top for various news stories, and it works fine. However the items (which are floated divs) are in a div which is floated left, which for some reason isn't shrinking to those items (which are it's only contents).</p>
  
  <p>As far as I was aware, a floated div always shrunk to it's contents, but this particular one is expanding to 100% of the page it seems. I've coloured the background of the containing div in grey to show you what I mean.</p>
  
  <p>I want it to shrink to the contents so that I could use a centering trick, and it would then center the div no matter how many divs are in the top news items. But because it's not shrinking, the trick obviously isn't working.</p>
  
  <p>The CSS for each of the news item divs is below:</p>
  
  <pre class="lang-css prettyprint-override"><code>.news-top-item {
      border-radius: 10px;
      border-color: #3f7dae;
      border-style: solid;
      border-width: 2px;
      float: left;
      width: 19%;
      text-align: center;
      margin-right: 0.5%;
      height: 13em;
      padding-top: 0.5em;
      cursor: pointer;
      position: relative;
  }
  </code></pre>
  
  <p>They've also got a span inside that has a little CSS attached to it to make the whole thing a link:</p>
  
  <pre class="lang-css prettyprint-override"><code>.news-top-item span {
      display: inline;
      position:absolute;
      width:100%;
      height:100%;
      top:0;
      left: 0;
      z-index: 2;
      background-image: url('/tmbc_images/include/1pixel.gif');
      cursor: pointer;
  }
  </code></pre>
  
  <p>I doubt that's interfering, but have put it in just in case.</p>
  
  <p>The outer div has only 'float: left' and the background colour applied to it.</p>
  
  <p>Any help would be much appreciated.</p>
  
  <p>Thanks,</p>
  
  <p>James </p>