ओवरलैपिंग divs

Question

मुझे 2 ओवरलैपिंग divs की आवश्यकता है, जो नीचे दिए गए जैसा दिखता है।

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

लेकिन किसी भी तरह से इसे प्राप्त करने में असमर्थ हूं। here is the place am fiddling out क्या कोई मुझे बता सकता है कि मैं गलत कहां जा रहा हूं।

संपादित करें 1: मेरे पास एक बायां div और दायां div है। बाएं div में ओवरलैपिंग div है। दायां div एक सामान्य div है। मुझे लगता है कि आप में से अधिकांश उलझन में हैं और सही div को ओवरलैपिंग करने के लिए चीज है, बाएं div में 2 divs हैं जिन्हें मुझे ओवरलैप करने की आवश्यकता है।

आपको सभी को भ्रमित करने के लिए खेद है।

Answer 1

मुझे लगता है कि आप कुछ इस तरह हैं:

एचटीएमएल

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

सीएसएस

.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, में एक/b = 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 "जैसा आपको पसंद है। मैंने केवल फ़ायरफ़ॉक्स में परीक्षण किया है।

Answer 4

आपको इसके लिए top, left और z-index गुणों का उपयोग करना होगा।