वर्ड-ब्रेक प्रॉपर्टी

word-break प्रॉपर्टी लंबे शब्द के अक्षरों को नई लाइन पर ब्रेक करने की अनुमति देती है, यदि वह शब्द कंटेनर की चौड़ाई में फिट नहीं होता है।

सिंटैक्स

सेलेक्टर {
	word-break: break-all | keep-all | normal;
}

वैल्यू	विवरण
`break-all`	लंबे शब्दों को नई लाइन पर ब्रेक करने के लिए मजबूर करता है, यदि वह शब्द कंटेनर में फिट नहीं होता है।
`keep-all`	वर्णों को ब्रेक करने के लिए।
`normal`	स्टैंडर्ड बिहेवियर: यदि लंबा शब्द कंटेनर की चौड़ाई में फिट नहीं होता है - तो वह बस उसकी सीमा से बाहर निकल जाएगा (इसके साथ ही नई लाइन से शुरू होगा)।

डिफॉल्ट वैल्यू: normal.

इस उदाहरण में बहुत लंबा शब्द कंटेनर में फिट नहीं होगा और उसकी सीमाओं से बाहर निकल जाएगा (इसके साथ ही नई लाइन से शुरू होगा):

<div id="elem">
	Lorem ipsum dolor sit amet
	loooooooooooooooooooooooooooooooongword,
	consectetur adipiscing elit.
</div>

#elem {
	width: 200px;
	word-break: normal;
	border: 1px solid red;
}

और अब वे अक्षर जो फिट नहीं हो रहे थे, बस अगली लाइन पर ब्रेक हो जाएंगे:

<div id="elem">
	Lorem ipsum dolor sit amet
	loooooooooooooooooooooooooooooooongword,
	consectetur adipiscing elit.
</div>

#elem {
	width: 200px;
	word-break: break-all;
	border: 1px solid red;
}

overflow-wrap प्रॉपर्टी,
जो लंबे शब्द के अक्षरों को नई लाइन पर ब्रेक करने की भी अनुमति देती है
hyphens प्रॉपर्टी,
जो शब्दों को सिलेबल्स में ब्रेक करने को एनेबल करती है
overflow प्रॉपर्टी,
जो ब्लॉक की सीमा से बाहर निकलने वाले हिस्सों को काटती है
wbr टैग,
जो HTML के माध्यम से सॉफ्ट ब्रेक इम्प्लीमेंट करता है
br टैग,
जिसकी मदद से आप टेक्स्ट को नई लाइन पर ब्रेक करने के लिए फोर्स कर सकते हैं