Menu
I am looking for the best solution to allow text to wrap in the middle of a word if necessary. By best, I mean most browser-compatible, and will favor word breaks before it breaks inside a word.
It would also help if the markup looked nicer than mine (see my answer).
Edit:
Note this is specifically for user-generated content.
Edit 2:
About 25% of Firefox users on the site in question are still using v3.0 or below, so it is critical to support them. This is based on the last month worth of data (about 121,000 visits).
866
Go to Picture Format or Shape Format and select Arrange > Wrap Text. If the window is wide enough, Word displays Wrap Text directly on the Picture Format tab. Choose the wrapping options that you want to apply. For example, In Line with Text, Top and Bottom, and Behind Text.
Right-click the control for which you want to enable or disable text wrapping, and then click Control Properties on the shortcut menu. Click the Display tab. Select or clear the Wrap text check box.
You can force long (unbroken) text to wrap in a new line by specifying break-word with the word-wrap property. For example, you can use it to prevent text extending out the box and breaking the layout. This commonly happens when you have a long URL in the sidebar or comment list.
The css property word-wrap: break-word will force long words to wrap to the next line if they are too long for their container. This is supported by IE (going way back), Firefox and Safari.
Edit: Looks like you may be able to achieve this in older versions of Firefox as well using white-space: -moz-pre-wrap and white-space: pre-wrap. See here for more info. I have not tested this with older versions of Firefox though.
137
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
