水平滾動條工作不正常

Question

我做了一個的jsfiddle演示我的問題：here it is along with the css

<div -d=wrapper"> 
<div id="header">Hello, I'm the header</div> 
<div id="content"> 
    <div id="content-left" >Some text in left</div> 
    <div id="content-right">Some text in right</div> 
</div> 
<div id="footer">Footer</div> 
</div> 

我想是的div內容左和內容的權利得到更窄，發芽滾動因爲窗口在x軸上變窄了。

它的功能是一旦沒有足夠的空間存放兩個div，就會將內容疊加到內容的左側而不是縮小它們。我希望滾動條僅在需要時才顯示。

Answer 1

爲#content明確設置width否則它會嘗試聰明幷包裝元素。

jsFiddle

#content {width:300px;} 

Answer 2

JSFiddle

設置，如果你需要在#content ......然後給每列50％的寬度max-width。

#content{ 
max-width: 300px; 
} 

#content-left{ 
width: 50%; 
} 

#content-right{ 
width: 50%; 
}