2013-01-31 7 views
8

सीएसएस या JQuery (सीएसएस वरीय) का उपयोग करना के लिए,साथ एक div दे "text-align: छोड़ दिया" लिपटे सामग्री केवल

यह (100% की एक div लेने के लिए संभव है चौड़ाई), इसकी सामग्री केंद्रित है, और बाईं ओर लपेटने वाली किसी भी सामग्री को संरेखित करें?

कल्पना करें कि आपके ब्राउज़र पर केंद्रित आइकन का एक सेट है। यदि आप दूसरी पंक्ति के केंद्र में प्रदर्शित लपेटने वाले आइकन रखने के बजाय, अपने ब्राउज़र की चौड़ाई को कम करते हैं, तो मैं उन्हें बाएं संरेखित करना चाहता हूं।

मैंने पोस्ट करने से पहले यहां खोज करने की कोशिश की है, लेकिन मेरे प्रश्न से बिल्कुल मेल खाने वाली कुछ भी नहीं मिल सका।

अद्यतन:

@Explosion गोलियां इसे हल, लेकिन यहाँ एक अद्यतन JSFiddle कि बाहरी div को word-wrap: pre-wrap; जोड़कर IE और क्रोम की तुलना में अन्य ब्राउज़रों के पते: http://jsfiddle.net/etY4r/2/

+0

और मैं अब तक की कोशिश की है, है ..... –

उत्तर

10

आप के साथ ऐसा कर सकते हैं बस सीएसएस (और काफी सरल)।

http://jsfiddle.net/ExplosionPIlls/etY4r/

inline-block तत्वों पूरे div के संदर्भ में केंद्रित कर रहे हैं, लेकिन जब आप विंडो का आकार काफी घटा: बाहरी div text-align: center और भीतरी div (आइकन वाले) text-align: leftdisplay: inline-block साथ किया जा सकता है तत्वों को आंतरिक तत्व के अंदर ही लपेटने का कारण बनता है और वे बाईं ओर गठबंधन होते हैं।

+0

आश्चर्यजनक है कि सरल समाधान महान सोच! –

+0

@ एक्सप्लोजन पिल्स आपको बहुत बहुत धन्यवाद! मुझे खुशी है कि मैंने पूछा, क्योंकि यह सबसे साफ तरीका होना चाहिए ... कभी! – TAS

+0

मैं कल खुद को ढूंढ रहा था। दो ताली! – Webapper

2
$('.class').css('css property','alignment'); 

उदाहरण:

$(document).ready(function(){ 
    $('.myClass').css('text-align','left'); 
    $('.myClass2').css('text-align','center'); 
    $('.myClass3').css('text-align','right'); 
}); 

.css() इस प्रारूप में किसी भी सीएसएस संपत्ति के साथ काम करता है: डी

संबंधित मुद्दे