隱藏要素，即溢出寬度固定元件

Question

考慮以下...

http://roosteronacid.com/viewport.png

這裏的三個元素，以僅示出一個元件（最左邊的）。這可能嗎？我已經嘗試了一些沿着這條線...

<div id="container"> 
    <div></div> 
    <div>I overflow the container, so I should be hidden</div> 
    <div>I also overflow the container, so I should be hidden</div> 
</div> 

#container { 
    overflow: hidden; 
    width: 300px; 
} 

#container div { 
    float: left; 
    width: 300px; 
} 

......但我不能沒有指定一個固定的高度得到它的工作。這是我不想要的。元素的高度必須是動態的，並根據其內容增長。

注意：這必須是與iOS Safari兼容的。

Answer 1

參見：http://jsfiddle.net/9Nh7t/

• 更換float: left，與display: inline-block。
• 要防止打包，請在父元素上添加white-space: nowrap。

爲了擺脫「空白」（visible here，例如）的，最簡單的解決方法是從你的HTML中刪除空白：http://jsfiddle.net/9Nh7t/2/