CSS Floated Elements和overflow：hidden;

Question

前几天我注意到了一些奇怪的行为，但无法找到FF和Chrome在以下代码（jsfiddle）上表现不同的答案或原因：

http://jsfiddle.net/t6g2P/

HTML：

<div class="container">
  <div class="one">one</div>
  <div class="two">two</div>
</div>

CSS：

.container {
 float: left;   
}
.container .one {
    width: auto;
    float: left;
    overflow: hidden;
    padding: 0 5px;
    height: 20px;
    border: 1px solid deeppink;
}

.container .two {
    width: auto;
    overflow: hidden;
    padding: 0 5px;
    height: 20px;
    border: 1px solid purple;
}

FF：元素彼此之间

Chrome：元素已浮动

有什么想法吗？理解不一致的行为会很棒。谢谢！ ;）

格尔茨