強制div低於另一個並防止重疊

我有兩個Div元素。第一個應該是100％的高度和寬度的屏幕。我希望第二個Div是100％寬度，但取決於內容可變高度，並開始內聯（低於第一個）。因此，整個屏幕是Div 1，你必須向下滾動才能看到Div 2。但是我試過的所有東西都是重疊的。強制div低於另一個並防止重疊

<div style="background-color:red;height:100%;width:100%;left:0px;top:0px"></div> 
<br/> 
<div style="width:100%;position:relative;background-color:yellow"> 
     <br/>test<br/>test<br/>test<br/>test<br/>test<br/>test<br/>test<br/>test<br/>test<br/>test<br/>test<br/>test<br/>test<br/>.. 
</div>

http://jsfiddle.net/FBJ8h/

來源

2013-01-02 user759885

Becasue

position:absolute

使得div不佔用，這意味着其他元素在對齊和定位時不會「看到」它們。

使用此：

html,body { 
    height:100%; 
} 
div.div2 { 
    top:100%; 
}

JSFiddle

來源

2013-01-02 03:39:46 Passerby

首先，你必須設置HTML和身體標籤爲height：100％：

html, body { 
    height:100%; 
}

第二件事，你必須改變是將第一個div的位置設置爲「相對」而不是「絕對」（因爲它位於jsfiddle文件中）：

position: relative;

我希望它可以幫助...

編輯：並刪除了兩個div之間的<br> -Tag - 如果不是，就會有他們之間的差距白...

來源

2013-01-02 03:37:18 atreju

優秀的以下謝謝這個工程 – user759885

-1

使用時應使用「明確：既」 ...添加div標籤

<style> 
.clearfix{ 
clear:both; 
} 
</style> 
<body> 
<div class="clearfix"></div> 
<body>

來源

2015-03-06 03:35:04

這不起作用。問題是位置：絕對屬性。 – FrenkyB

強制div低於另一個並防止重疊

回答

相關問題