Перекрывающиеся divs

Question

Мне нужно 2 перекрывающиеся divs, которые выглядят как показано ниже.

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

Но как-то не могу это получить. here is the place am fiddling out Может ли кто-нибудь сказать мне, где я иду не так.

Редактировать 1: У меня есть левый div и правый div. Левый div имеет перекрывающийся div. Правый div - нормальный div. Я предполагаю, что большинство из вас сбиты с толку и что правый div является перекрывающимся, есть два divs в левом div, которые мне нужны для перекрытия.

Извините, что смутил вас всех.

Answer 1

Я думаю, что вы хотите что-то вроде этого:

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; 
} 

Edit: в вашем случае родитель = contentContainer, а/Ь = leftContainer/rightContainer

Answer 2

Я не совсем уверен, как использовать Z-индекс

Но я думаю, что это может помочь в стиле тега

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

минус собственность работы, насколько хорошо она должна быть все о тестировании

Answer 3

Я изменился, как это:

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

Вы можете изменить " 30px ", как вам нравится. Я тестировал только FireFox.

Answer 4

Для этого вам необходимо использовать top, left и z-index.