Originally Posted by VIPStephan
I would rather directly work with line breaks and/or soft hyphens, assuming that the layout/content is pretty static.
Soft hyphens won't break the line any better than standard wrapping does when it comes to staying within the visual bounds of the border-radius. They will just occasionally break a word into two pieces rather than sending the whole word to the next line.
But we are agreed with respect to the line breaks. That would be best in a perfectly controlled environment with static text. However, if font sizes are not held to a static "px" measurement and the user has increased their font sizes you will likely be in trouble. Likewise, if the client will have rotating or frequently updated information placed in the "oval" you will need something a bit more "client-proof" to avoid having them break their own layout.
The option presented in my sample page is crappy (I can't state that enough) but it has a small degree of insurance built into it, in that more text will work in it than will not (up to a certain pre-determined number of lines of text). I'd really like to see a CSS3 style to take care of this automatically but for now this is the best hack I could think of to try to fill the need.