2011-05-20 8 views
6

मैं इस संरचना है:सीएसएस text-align

<div class="father"> 
This string is left-aligned 
<div class="divToCenter" style="display:inline-block;"> 
    //contains other divs.I used inline block for making this div as large as 
    //content ATTENTION: its width is not fixed! 
</div> 

</div> 

मैं कैसे कह सकते हैं:

मुझे करते ही वर्ग "divToCenter" "पिता" div में केंद्रित नामित ।

धन्यवाद

लुका

+0

विवरण के लिए कुछ की जरूरत है inline-block ... – Murugesh

+0

divs हमेशा अपने प्रत्यक्ष माता पिता की हद तक अपनी सामग्री को समायोजित करने के, खिंचाव। 'प्रदर्शन के लिए कोई ज़रूरत नहीं: इनलाइन-ब्लॉक;' – Krimo

+0

पिता div बड़ा है और इसकी चौड़ाई इतनी divToCenter तय हो गई है अपने पिता की चौड़ाई का विस्तार करने के – luca

उत्तर

3
#left {float: left; background: #eee; width: 200px; /* width is optional */} 
#content {overflow: hidden; text-align: center;} 


<div class="father"> 
<div id="left">This string is left-aligned</div> 
<div id="content"> 
    //contains other divs.I used inline block for making this div as large as 
    //content 
</div> 
</div> 

नाव बाईं ओर बाईं गठबंधन स्ट्रिंग या ब्लॉक, तो overflow:hidden साथ मैं टी स्वचालित रूप से शेष स्थान ले लेगा और आप text-align कर सकते हैं कि आप

या तो बाएं सामग्री को इनलाइन ब्लॉक में परिवर्तित कर सकते हैं ताकि यह और सामग्री दोनों तरफ हो और आप प्रत्येक को टेक्स्ट-एलाइन कर सकें अलग

+0

हाँ धन्यवाद! मैंने "संसाधन-बाएं-गठबंधन-सामग्री" समाधान को अंतिम संसाधन के रूप में भी रखा है .. मुझे लगता है कि बिना किसी और संरचना का उपयोग करने के लिए एक सीएसएस चयनकर्ता होना चाहिए संशोधन लेकिन मुझे लगता है कि मैं गलत था =) – luca

+0

मैं उस बेवकूफ उदाहरण को देखता हूं जिसे आपने अब किसी अन्य उत्तर पर टिप्पणी में छोड़ा है और हां, मुझे लगता है कि बाएं गठबंधन को लपेटना सबसे अच्छा जवाब होगा - http://jsfiddle.net/clairesuzy/ ea47e/6/- आप किसी भी अन्य तरीके से पिता div के "टेक्स्ट नोड" भाग को लक्षित नहीं कर सकते हैं – clairesuzy

2
div.divToCenter 
{ 
margin: 0 auto; 
} 
+0

आप पाठ संरेखित तरह केंद्रित किए जाने की div के अंदर का पाठ की जरूरत है करते हैं या आप div ही चाहते हैं केंद्रित होना है? वे 2 अलग-अलग चीजें हैं! – Jawad

+0

मैं div केंद्रित .. (Btw div अपनी content..so सामग्री के वास्तविक आकार गठबंधन किया जाना नहीं कर सकते है) – luca

+0

@ JAA149 मैं भी करने से पहले अपने टिप की कोशिश की लेकिन यह working..I जोड़ा नहीं कर रहा है चाहता हूँ "! महत्वपूर्ण" बनाने के लिए सुनिश्चित करें कि अधिभावी नहीं हो रहा है ..If मैं पिता div है मैं (divToCenter सहित) सभी पाठ केंद्रित करने के लिए "text-align" संपत्ति लागू .. लेकिन मैं सिर्फ केंद्र – luca

1
.father { text-align: center; } 
.father div.divToCenter { margin: 0 auto; } 

अद्यतन: सामग्री पर

.father { text-align: left; } 
.father div.divToCenter { width:Xpx; margin: 0 auto; } 
+0

निश्चित नहीं है, जैसा कि मैंने ऊपर लिखा था अगर मैं "पाठ लागू -लिग्न "संपत्ति को पिता div में मेरे पास सभी पाठ (divToCenter सहित) केंद्रित है .. लेकिन मुझे बस केंद्र पर div चाहिए .. – luca

+0

मैंने अपनी पोस्ट को अपडेट किया है, आपकी आवश्यकताओं को प्राप्त करने की उम्मीद करते हुए, बस चौड़ाई की संपत्ति सेट करें आंतरिक div यह सुनिश्चित करने के लिए कि ऑटो मार्जिन सक्रिय है। – Mousa

+0

divToCenter चौड़ाई गतिशील है .. निश्चित नहीं .. धन्यवाद! मुझे लगता है कि मैं "बाएं सामग्री को लपेटें" समाधान का उपयोग करूंगा – luca