मैं स्टैक्ड तत्वों (यानी नकारात्मक मार्जिन वाले तत्व) के आसपास पाठ कैसे लपेट सकता हूं?

Question

मुझे आशा है कि कोई मेरी मदद कर सकता है।

मैं, कई के आसपास पाठ खड़ी जारी तत्वों रैप करने के लिए चाहते हैं लेकिन जब मैं दूसरा तत्व पाठ गेंद (नीचे देखें) अदा नहीं करता है के लिए एक नकारात्मक मार्जिन द्वारा जोड़ा जा रहा ...

है किसी को भी एक समाधान है इससे मुझे मदद मिल सकती है?

अग्रिम धन्यवाद!

मैं अब तक यहाँ क्या किया है:

<style> 
.elements { 
    float:left; 
    padding:10px; 
    width:50%; 
    background:#039; 
    color:#fff; 
    font-family:Arial, Helvetica, sans-serif; 
    color:#fff; 
    padding:50px; 
    box-sizing:border-box; 
    margin-right: 20px; 
    position: relative; 
} 

#element-two { 
    margin-top:-50px; 
    background:#900; 
    margin-left:30px; 
} 
</style> 


<div id="post"> 
<div id="element-one" class="elements">Element 1</div> 
<div id="element-two" class="elements">Element 2</div> 
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam id dictum odio. Interdum et malesuada fames ac ante ipsum primis in faucibus. Vivamus vitae leo dictum, <br> 
<br> 
<br> 
porttitor augue ut, accumsan nunc. Phasellus at malesuada orci, quis varius nulla. Nullam dui purus, elementum non fermentum eu, 
laoreet ac massa. Maecenas dictum elit sit amet mi pretium tincidunt. Maecenas interdum elementum lectus, eu aliquam nibh lacinia nec. 
<br><br><br> 
Quisque facilisis accumsan blandit. Mauris eget pulvinar lacus. Donec pretium posuere mattis. Suspendisse et tempor orci, sit amet placerat neque. Etiam laoreet massa eu libero posuere, sit amet laoreet metus auctor. 

</div> 

मैं पेज कैसे करना चाहेंगे

देखने के लिए के रूप में यह

Answer 1

आशा इस मदद करता है कैसे पेज लग रहा है ।

`https://jsfiddle.net/0zf7rxpn/1/` 

संक्षेप में, मैंने नकारात्मक मार्जिन-तल को नीले तत्व में रखा, इसलिए लाल तत्व ऊपर गया। फिर लाल तत्व के लिए मैंने कुछ मार्जिन-दाएं दिया, स्थिति: सापेक्ष और नकारात्मक अधिकार।