DIV位置絕對原因後div來隱藏

我有一個div用下面的風格等元素DIV位置絕對原因後div來隱藏

#holder{ 
    margin-top: 1px; 
    background-color: #DCE1E5; 
    position:absolute; 
    left:0; 
    right:0; 
    display:block; 
    padding:8px; 
}

我的問題是，我這個div標籤後輸入任何元素是div背後隱藏例如

<div id="holder">My Stuff here of</div> 
<div id="somethingelse">This will be hidden behind the top div</div>

任何想法，我如何解決這個問題，並讓它與IE7兼容？

來源

2013-04-18 BaconJuice

將#holder放回流中，以便它不會與其他元素重疊。或者其他元素的絕對位置。或者將div放在一個容器中並將其他div放在不同的容器中。你所描述的不是問題，而是缺乏對我認爲的絕對功能的理解。 – Lowkase

你應該嘗試position: relative;而不是絕對在下一個div。

來源

2013-04-18 17:01:24 Rebule

這是一個z索引問題。您可以通過將z-index值分配給各個元素來覆蓋此行爲。並且預警，IE7將「位置」風格的任何元素指定爲z-index值，因此可能需要進行一些測試才能使其正常工作。您通常必須將z-index分配給父元素才能使其正常工作。

來源

2013-04-18 17:01:39 seannachie

您應該爲絕對元素指定頂部和左側。 somethingelse元素落後於您的holder。

要麼刪除背景顏色以查看#somethingelse或爲這兩個元素分配z-index。然後你可以看到兩個元素重疊。您也可以添加不透明度或使持有人的位置相對。

來源

2013-04-18 17:02:03

當您將#holder DIV更改爲「絕對」位置時，這意味着您要將其從頁面上的常規元素流中取出。因此，所有其他元素將流向代替它。根據您的最終目標可能有很多解決方案。但是，只要您提供給我們的信息，您可以通過將位置更改爲「相對」來解決問題。

來源

2013-04-18 17:02:12 SunSparc

position：absolute;從框模型定義的流中移除元素。任何小於持有者的元素都將被其隱藏。解決方法是不要使用position：absolute;，因爲我明白，你並不是真的想要通過這種方式實現的東西。

我會建議你把時間來了解什麼盒子模型是：http://www.w3.org/TR/CSS2/box.html

來源

2013-04-18 17:02:28

當你絕對位置的元素，它是從正常的文檔流取出，放置在您指定的點。所有其他項目繼續遵循文檔的正常流程，這意味着其中一些可能與絕對定位的元素位於相同的位置。

爲了解決這個問題，你可以通過以下兩種方法之一：

不要絕對位置#holder。這將允許它保持在正常的文檔流程中並與其他元素一起玩。

或

提供適當的利潤給其它元件從#holder位置離開。

來源

2013-04-18 17:03:00

IE7必須爲位置相對或絕對的任何元素設置z-index屬性。

CSS

#holder{ 
position:absolute; 
left:0; 
right:0; 
display:block; 
padding:8px; 
margin-top: 1px; 
background-color: #DCE1E5; 
z-index: 1;} 

#somethingelse { 
position: relative; 
top: 40px; 
z-index: 1000;

}

DEMO是在這裏：http://jsfiddle.net/B3jZ5/2/

來源

2013-04-18 17:14:15

添加首要位置，如果是絕對要somethingelse元素。

頂部：#holder

或邊距的高度：#holder的高度如果#holder元素是浮動的像浮動：左或右;

來源

2013-04-18 17:20:18

DIV位置絕對原因後div來隱藏

回答

相關問題