टेक्स्ट चौड़ाई को सीमित करने के लिए कैसे करें

Question

मैं टेक्स्ट के ब्लॉक की चौड़ाई को सीमित करना चाहता हूं, इसलिए ऐसा लगता है कि प्रत्येक पंक्ति के किनारे पर ब्रश है।

कुछ इस तरह:

Texttttttttttttttttttttt 
tttttttttttttttttttttttt 
tttttttttttttttttttttttt 

इस से:

Texttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttt

मैं div के या पी की चौड़ाई निर्दिष्ट करने के लिए कोशिश की है, लेकिन यह मेरे लिए काम नहीं किया। कोई सुझाव?

Answer 1

प्रयास करें आप इस तरह सीएसएस लागू कर सकते हैं:

div { 
    word-wrap: break-word; 
    width: 100px; 
} 

आमतौर पर ब्राउज़र शब्द को तोड़ने नहीं है, लेकिन word-wrap: break-word; शब्द भी तोड़ने के लिए यह बाध्य करेगा।

डेमो: http://jsfiddle.net/Mp7tc/

अधिक जानकारी के बारे में word-wrap

Answer 2

<div style="max-width:200px; word-wrap:break-word;">Texttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttt</div> 

Answer 3

आप उपयोग कर सकते हैं word-wrap : break-word;

Answer 4

उपयोग सीएसएस संपत्ति word-wrap: break-word;

देखने के लिए यहाँ उदाहरण: http://jsfiddle.net/emgRF/

Answer 5

इस प्रयास करें:

<style> 
p 
{ 
    width:100px; 
    word-wrap:break-word; 
} 
</style> 

<p>Loremipsumdolorsitamet,consecteturadipiscingelit.Fusce non nisl 
non ante malesuada mollis quis ut ipsum. Cum sociis natoque penatibus et magnis dis 
parturient montes, nascetur ridiculus mus. Cras ut adipiscing dolor. Nunc congue, 
tellus vehicula mattis porttitor, justo nisi sollicitudin nulla, a rhoncus lectus lacus 
id turpis. Vivamus diam lacus, egestas nec bibendum eu, mattis eget risus</p> 

Answer 6

मुझे लगता है कि आप जो करने की कोशिश कर रहे हैं वह बिना रिक्त स्थान के लंबे टेक्स्ट को लपेटना है।

इसे देखें: Hyphenator.js और यह demo है।

Answer 7

<style> 
    p{ 
     width:  70% 
     word-wrap: break-word; 
    } 
</style> 

यह मेरे मामले में काम नहीं कर रहा था। यह निम्नलिखित शैली जोड़ने के बाद ठीक काम किया।

<style> 
    p{ 
     width:  70% 
     word-break: break-all; 
    } 
</style> 

Answer 8

display: inline-block; 
max-width: 80%; 
height: 1.5em; 
overflow: hidden; 
text-overflow: ellipsis; 
white-space: nowrap;