寬度爲100％且浮動的div使得一個離開屏幕一側

我想構建一個具有水平滾動的頁面。我想要一個div來填充視圖窗口。寬度爲100％且浮動的div使得一個離開屏幕一側

我將寬度設置爲100％，以便在任何尺寸的屏幕上填充窗口，但是您不能將下一個div浮動到其一側。

有沒有人知道一種方法來做到這一點或根據屏幕的大小來設置寬度的方法。

我正在使用PHP和codeigniter與一點的JavaScript。

來源

2012-07-03 1ftw1

您可能需要設置'body'和寬度的' html標籤到200％，這樣secon就有空間了d'div' – starbeamrainbowlabs

使用你的100％Div作爲包裝，並使用其中的一些div來達到你的設計。我認爲你必須指定第二個div的寬度，你需要浮動和應用浮動，希望這會幫助你

來源

2012-07-03 04:41:42

我無法指定第二個div的寬度，因爲我需要更多2然後我需要它們以適合窗口 – 1ftw1

我們可以具體說明在warpers中出現的div的數量嗎？ –

嗯..我認爲然後指定寬度作爲自動或沒有指定寬度將幫助我們...請試試看我不確定填充我們的包裝寬度的100％ –

查看此答覆我發佈了一個回覆其他類似問題。

https://stackoverflow.com/a/11293897/921204

所需要的變化是：

一）你不需要 '左' DIV。所以刪除它。

b）因爲想要水平滾動，所以不要指定overflow-x: hidden;。

此外，根據需要更改中心div的尺寸。在你的情況下，將它設置爲100%寬度

來源

2012-07-03 04:42:11 techfoobar

你的意思是這個http://jsbin.com/upoqec/2/edit#preview？

HTML：

<body onload="resize()"> 
<div class="view" id="view"> 
</div> 
<div class="follow"> 
    </div> 
</body>

CSS：

body{overflow:auto; width:100%: height:100%;} 
.view{width:100%; height:400px; float:left; border:2px solid black;} 
.follow{position:absolute; left:100%; width:900px; height:400px; border:2px solid red; margin-left:20px;}

的Javascript：

function resize(){ 
    var winW = 630, winH = 460; 
if (document.body && document.body.offsetWidth) { 
winW = document.body.offsetWidth; 
winH = document.body.offsetHeight; 
} 
if (document.compatMode=='CSS1Compat' && 
    document.documentElement && 
    document.documentElement.offsetWidth) { 
winW = document.documentElement.offsetWidth; 
winH = document.documentElement.offsetHeight; 
} 
if (window.innerWidth && window.innerHeight) { 
winW = window.innerWidth; 
winH = window.innerHeight; 
} 
document.getElementById("follow").style.width=winW.toString()+"px"; 
document.getElementById("follow").style.height=winH.toString()+"px"; 
}

來源

2012-07-03 04:43:51

寬度爲100％且浮動的div使得一個離開屏幕一側

回答

相關問題