使div大於容器

下面的代碼我正在嘗試使「ThumbNails」與contet（動態）所需的一樣大，並顯示（僅）水平滾動條，如果不適合contine div但我失敗。我在做什麼錯？使div大於容器

HTML：

<body> 
<div id="Fascione"></div> 
<div id="Wrapper"> 
    <div id="Menu"></div> 
    <div id="Contenuto"> 
    <div id="VariableImg"></div> 
    <div id="Back"></div> 
    <div id="Next"></div> 
    <div id="ThumbNails"> 
    <img><img><img> 
    </div> 
    </div> 
</div> 
<div id="Footer"></div> 
</body>

CSS：

body{width:1024px; margin:0px auto;} 
div#Fascione{width:inherit;min-height:125px;border-bottom:2px solid black;} 
div#Wrapper{width:inherit;padding:8px 0px 4px 0px;} 
div#Wrapper{width:inherit;padding:8px 0px 4px 0px;} 
div#Menu{float:left;width:200px;} 
div#Contenuto{overflow:hidden;margin-left:208px;} 
div#Back, div#Next{width:49%;cursor:pointer;text-align:center;margin:1% auto;border:1px dotted #1111cc;background-color:#ffffff;} 
div#Back{float:left;} 
div#Next{float:right;} 
div#Back:hover, div#Next:hover{border:1px solid #1111cc;} 
div#ThumbNails{clear:both;max-height:180px;overflow-x:auto;overflow-y:hidden;background-color:#f0f0f0;} 
div#Footer{clear:left;width:inherit;} /* clear left needed in combination with the overflow:hidden of Contenuto */

編輯：刪除舊的無效鏈接。

來源

2012-02-26 rodedo

我實際上想要達到與這個問題中發佈的css代碼相同的外觀... – rodedo 2012-02-26 18:26:13

我認爲你已經混淆了你的'overflow-x'和'overflow-y'。「overflow-x」是水平的，「overflow-y」是垂直的 - 所以你需要'overflow-y：auto'和'overflow-x：hidden'。 – 2012-02-26 19:22:13

不，不;我真的希望它水平滾動而不是垂直滾動;問題是用我的代碼圖片轉到下一行，滾動條根本沒有出現。我也嘗試過'white-space：nowrap;'並且使用'overflow-x：scroll;'沒有成功。 – rodedo 2012-02-27 10:32:36

正如@My Head Hurts所指出的，正確的答案是添加white-space:nowrap;。

來源

2012-03-05 16:08:39 rodedo

使div大於容器

回答

相關問題