2010-06-22 71 views
8

我需要2個重疊的div,看起來像下面那個。重疊divs

------------------------------------ 
    |      |    | 
    | ------------------ |    | 
    | '     '|    | 
    | '     '|    | 
    | '     '|    | 
    | '     '|    | 
    | '     '|    | 
    | '     '|    | 
    | '     '|    | 
    | --------------------|    | 
    | '     '|    | 
    | '     '|    | 
    | -------------------|    | 
    |      |    | 
    |      |    | 
    ------------------------------------ 

但不知何故我無法得到它。 here is the place am fiddling out 誰能告訴我我哪裏錯了。

編輯1: 我有一個左div和右div。左邊的div有重疊的div。正確的div是一個正常的div。我想大多數人都感到困惑,而事情是正確的div是重疊的,在左邊的div中有2個div,我需要這些重疊。

很抱歉讓大家困惑。

+0

編輯:只需交換我給你的例子的z-index。 – 2010-06-22 05:39:45

回答

15

我想你想是這樣的:

HTML

<div class="parent"> 
    <div class="a"></div> 
    <div class="b"></div> 
</div> 

CSS

.parent { 
    position: relative; 
} 

.a { 
    position: absolute; 
    width: 100px; 
    height: 100px; 
    z-index: 100; 
    background: red; 
} 

.b { 
    position: absolute; 
    width: 80px; 
    height: 180px; 
    z-index: 110; 
    left: 10px; 
    background: blue; 
    top: 10px; 
} 

編輯:在您的案件父= contentContainer,A/B = leftContainer/rightContainer

+0

#parent不.parent – 2010-06-22 05:22:26

+0

@ d03boy,抱歉使用了錯誤的屬性。現在修復。 – 2010-06-22 06:18:41

-1

林真的不知道如何使用的z-index

但我認爲這可能會在風格標籤

margin:-50px -50px 0px 0px; 

負財產的作品,幫助它應該是所有有關測試如何

+1

沒有多大的幫助.. – Chaitanya 2010-06-22 04:52:37

0

我已經改變這樣的:

#rightContainer { 
    /*float:right ;*/ 
    width:20%; 
    /*margin:0px;*/ 
    margin-top: 30px; 
    margin-left: 30px; 
    padding:0px; 
    position:relative; 
    background-color:Lime; 
} 

你可以改變「 30px「,只要你喜歡。我只在FireFox中測試過。

0

您必須使用top,leftz-index屬性。