html - フロートの問題をクリアしていますが、Webkit ブラウザーに固有です

Question

私はフロートをクリアする基本に精通していますが、この場合は少し困惑しており、誰かが私を助けてくれることを願っています.

このページには、containerTimeline という名前のコンテナーがあり、すべてのコンテンツを包含することになっています。もちろん、コンテンツはコンテナに含まれていません。奇妙なことに、Firefox では問題なく動作しますが、Safari と Chrome では問題ありません。誰も理由を知っていますか？正しく表示されているブラウザはどれですか?

私はjsfiddle http://jsfiddle.net/T8n4v/へのリンクを持っています

これは、以下のコードの一部です。

    <div class="containerTimeline">
    <div class="year">
        <header>2012</header>
    <div class="month alt">
    <header>Sep</header>
    <ul class="events">
    <li class="event priority1"></li>
    <li class="event priority3"></li>
    </ul>
</div>
    <div class="month">
    <header>Oct</header>
    <ul class="events">
    <li class="event priority1"></li>
    <li class="event priority3"></li>
    </ul>
</div>
    <div class="month alt">
    <header>Nov</header>
    <ul class="events">
    <li class="event priority1"></li>
    <li class="event priority3"></li>
    </ul>
</div>
    <div class="month">
    <header>Dec</header>
    <ul class="events">
    <li class="event priority1"></li>
    <li class="event priority3"></li>
    </ul>
</div>
    <div class="month alt">
    <header>Jan</header>
    <ul class="events">
    <li class="event priority1"></li>
    <li class="event priority3"></li>
    </ul>
</div>
    <div class="month">
    <header>Feb</header>
    <ul class="events">
    <li class="event priority1"></li>
    <li class="event priority3"></li>
    </ul>
</div>
    </div><!-- end year -->
</div>

そしてそのCSS：

    body {
      width: 4800px;
    }
    .containerTimeline {
      outline:1px solid red;
      margin: 20px;
      min-height: 100%;
      position: relative;
      width: auto;
    }
    .containerTimeline .year {
      float: left;
      height: 41px;
      background: #e8e8e8;
    }
    .containerTimeline .year header{
      text-align: center;
      color: #666;
      font-size: 15px;
      text-transform: uppercase;
      padding: 10px 0;
    }
    .containerTimeline .month {
      width: 43px;
      float: left;
      background: #fff;
    }
    .containerTimeline .month.alt {
      width: 43px;
      float: left;
      background: #e8e8e8;
    }
    .containerTimeline .month header {
       height: 20px;
       width: 43px;
    }
    .containerTimeline .events {
      margin-top: 10px;
      position: relative;
    }
    .containerTimeline .event {
      position: relative;
      display: block;
      width: 36px;
      height: 36px;
      margin: 20px auto;
      margin-bottom: 25px;
      border-radius: 3px;
      border:1px solid black;
    }
    .group:before,
    .group:after {
    content:"";
    display:table;
   }
   .group:after {
    clear:both;
    }​

事前にご協力いただきありがとうございます。