div

2010-08-26 14 views
9

के अंदर div को लंबवत रूप से संरेखित करने का प्रयास कर रहा है, मैं नीचे एक और div के अंदर एक div को लंबवत रूप से संरेखित करने की कोशिश कर रहा हूं और मैं सापेक्ष/पूर्ण स्थिति का उपयोग नहीं करना चाहता हूं। नीचे मेरा मार्कअप है। ऐसा लगता है कि काम करता है। लेकिन मुझे यकीन नहीं है कि यह सबसे अच्छा समाधान है या नहीं। क्या कोई बेहतर तरीके से सिफारिश कर सकता है? एफएफ में भी, अगर मैं कंटेनर के चारों ओर सीमा को हटा देता हूं, तो यह काम करना बंद कर देता है। क्या किसी को पता है क्यों? धन्यवाद Konstantindiv


<html> 
<head> 
    <style type="text/css"> 
     .container 
     { 
      background-color: #ffff00; 
      height: 100px; 
      line-height: 100px; 
      border: solid 1px #666666; 
     } 
     .container .content 
     { 
      margin-top: 60px; 
      background-color: #ffbbbb; 
      height: 40px; 
      line-height: 40px; 
     } 
    </style> 
</head> 
<body> 
    <div class="container"> 
     <div class="content">test</div> 
    </div> 
</body> 
</html> 

उत्तर

27

पूर्ण स्थिति का उपयोग करें। मुझे लगता है कि यह संभव है कि आप पूर्ण स्थिति का उपयोग नहीं करना चाहते हैं, यह गलत धारणा पर आधारित है। अर्थात, यदि कंटेनर के रूप में अच्छी तरह से स्थिति विशेषता है, पूर्ण स्थिति के संबंध में हो पूरे पृष्ठ के लिए, लेकिन कंटेनर के संबंध में नहीं होगा, और फिर आप के साथ तुम क्या चाहते हो जाएगा: अब

.container 
{ 
    position: relative; 
} 

.container .content 
{ 
    position: absolute; 
    bottom: 0px; 
} 

, आकार चाहे कोई फर्क नहीं पड़ता, आपकी सामग्री कंटेनर के तल पर होगी।

+0

मैंने इसका उपयोग किया है। धन्यवाद। और साथ ही मैं इसे केंद्र में संरेखित करना चाहता हूं। उसको कैसे करे ? –

1

यही काम करेंगे ... केवल एक चीज आप खाली शीर्ष 60 पिक्सल में कुछ भी डाल करने के लिए सक्षम नहीं होगा है।

0

मुझे विश्वास है कि यदि आप सर्वोत्तम समाधान की तलाश में हैं, तो आपको वास्तव में सापेक्ष/पूर्ण स्थिति का उपयोग करना चाहिए।

क्या कोई विशिष्ट कारण है कि आप सापेक्ष/पूर्ण स्थिति से बचने की कोशिश कर रहे हैं?