CSS : Parent won't clearing child with absolute position -


इसलिए मेरे पास 3 बॉक्स है:

  बॉक्स 1 = लाल बॉक्स 2 = नीला बॉक्स 3 = पीले बॉक्स 1 बॉक्स में बॉक्स 2 बॉक्स 2 में बॉक्स 3 बॉक्स 3 शामिल हैं, डिविज़्स को जारी किया गया है और अतिरिक्त डिव स्टाइल का उपयोग करके साफ़ किया गया है = "स्पष्ट: दोनों"   

मुझे बॉक्स 2 को एक पूर्ण इस तरह से बॉक्स 1 की स्थिति:

मैंने इस तरह की कोशिश की है, लेकिन काम नहीं करेगा:

एचटीएमएल:

  & lt; div class = " box1 "& gt; & Lt; div वर्ग = "बॉक्स 2" & gt; & Lt; div वर्ग = "बॉक्स 3" & gt; बॉक्स -3 & lt; / div & gt; & Lt; div वर्ग = "बॉक्स 3" & gt; बॉक्स -3 & lt; / div & gt; & Lt; div वर्ग = "बॉक्स 3" & gt; बॉक्स -3 & lt; / div & gt; & Lt; div वर्ग = "बॉक्स 3" & gt; बॉक्स -3 & lt; / div & gt; & Lt; div वर्ग = "बॉक्स 3" & gt; बॉक्स -3 & lt; / div & gt; & Lt; div शैली = "स्पष्ट: दोनों;" & gt; & lt; / div & gt; & Lt; / div & gt; परीक्षण & lt; / div & gt;   

शैली: <पूर्व> .box1 {width: 300px; पृष्ठभूमि रंग: लाल; स्थिति: रिश्तेदार; } .box2 {width: 200px; पृष्ठभूमि का रंग: नीला; स्थिति: पूर्ण; सही: -100px; शीर्ष: 30px; } .box3 {ऊंचाई: 50px; चौड़ाई: 50px; पृष्ठभूमि रंग: पीला; बाईंओर तैरना; मार्जिन: 10px; कला रंग; }

यहां कोडपेन है:

क्या कोई भी मदद कर सकता है?

धन्यवाद

क्या स्थिति: रिश्तेदार से .box1 निकालने के बारे में है, और स्थिति: निरपेक्ष को .position: relative in .box2

नीचे स्निपेट देखें, और .box2

  .box1 {width: 300px; पृष्ठभूमि रंग: लाल; } .box2 {width: 200px; पृष्ठभूमि रंग: नीला; स्थिति: रिश्तेदार; सही: -150px; / * इस मान को -150px बदल दिया »» -100px * / top: 10px; / * ने इस मान को 10px बदल दिया »» 30px * / padding: 10px / * पैडिंग को जोड़ने की जरूरत है और अगर आपको * /} की आवश्यकता होती है। Box3 {height: 50px; चौड़ाई: 50px; पृष्ठभूमि रंग: पीला; बाईंओर तैरना; मार्जिन: 10 पीएक्स; कला रंग; }   
  & lt; div class = "box1" & gt; & Lt; div वर्ग = "बॉक्स 2" & gt; & Lt; div वर्ग = "बॉक्स 3" & gt; बॉक्स -3 & lt; / div & gt; & Lt; div वर्ग = "बॉक्स 3" & gt; बॉक्स -3 & lt; / div & gt; & Lt; div वर्ग = "बॉक्स 3" & gt; बॉक्स -3 & lt; / div & gt; & Lt; div वर्ग = "बॉक्स 3" & gt; बॉक्स -3 & lt; / div & gt; & Lt; div वर्ग = "बॉक्स 3" & gt; बॉक्स -3 & lt; / div & gt; & Lt; div शैली = "स्पष्ट: दोनों;" & gt; & lt; / div & gt; & Lt; / div & gt; परीक्षण & lt; / div & gt;      

Comments

Popular posts from this blog

java - ImportError: No module named py4j.java_gateway -

python - Receiving "KeyError" after decoding json result from url -

.net - Creating a new Queue Manager and Queue in Websphere MQ (using C#) -