I've been trying to use word-wrap to break long words into the next line, but unfortunately it's not working as expected. You can view my JsFiddle code for reference.
The divs on my page are generated dynamically, and here is an overview of what I am attempting to do:
- Reading the value of the div.
- Adding the word-wrap property to all child divs.
- Applying a custom font.
- Auto resizing text to fit within the div.
This is how I am trying to add the word-wrap feature:
//applying the word-wrap property
var target = $("#" + element);
target.find('*').each(function() {
$(this).css('display', 'inline-block');
$(this).css('word-break', 'break-word');
$(this).css('word-break', 'break-all');
});
However, the result is not forcing the word into the next line as desired. Please take a look at my JsFiddle and let me know how I can successfully make the word wrap to the next line.