I was checking the ED demo on my phone today and discovered a problem in the
Recent Discussions module. This also shows up in other ED pages where the message body or preview is seen.
The story class is set in a way that is non-responsive. There is no line-break and overflow is visible. On a mobile device it forces scaling or scrolling. On a desktop it just runs off the div. The theoretically correct CSS to use is
word-wrap: break-word but this used to have unwanted side effects. For example, Shakespeare in a small div on older browsers turned out like this:
O they have lived long on the alms-basket of word
s. I marvel thy master hath not eaten thee for a wor
d; for thou art not so long by the head as honorific
abilitudinitatibus: thou art easier swallowed than a
flap-dragon.
However I'm pretty sure since the IE8 and Firefox 9 days the box-model will try to first wrap at the space, then break the word. Not 100% though. I was testing this code with good results:
<div style="width:100px; border:1px solid #000; word-wrap:break-word">
"O, they have lived long on the alms-basket of words.
I marvel thy master hath not eaten thee for a word;
for thou art not so long by the head as
honorificabilitudinitatibus: thou art easier
swallowed than a flap-dragon."
</div>