Using CSS, how can I split a string (e.g. a long URL) in a table cell?

Question

Here's the situation: I'm trying my hand at some MySpace page customisations. If you've ever tried [stackoverflow], I'm sure you understand how frustrating it can be.
Basically it can be all customised via CSS, within a certain set of rules (e.g. the '#' character is not allowed...how useful!).
Have a look at this blog if you want more info, I used it as the basis for my customisations

So the only problem is with the comments section, where 'friends' post whatever they feel like. It already has...

max-width:423px;

...set on the table, but I've discovered if long URLs are posted in the comment section, it blows out the table width, regardless of the max setting!

Question: Is there a way to manage text that is going to push the width of the table?
Perhaps splitting/chopping the string? Or is there more I should be doing..?
The URLs are posted as text, not hrefs.

Using Firefox and Firebug btw.

Edit: Also javascript is not allowed ;)

Another edit Just checked with IE7, and it seems to work.. so firefox is being the hassle in this case..

Answer 1

Have you tried the various values for the "overflow" css property? I think that may do what you need in some permutation.

Answer 2

Your options are pretty limited, if you are using only CSS. You can try

 overflow: hidden

to hide the offending parts. CSS 3 supports text-wrap, but support for it is probably non-existent. IIRC there is an IE-only css-property for doing the same thing, but I can't remember it at the moment and my Google-Fu fails me.

Answer 3

a few browsers support word-wrap

ex.

<div style="width: 50px; word-wrap: break-word">insertsuperlongwordhereplease</div>

browser support currently is IE / Safari / Firefox 3.1 (Alpha)

Answer 4

I did a quick test and Firefox 3.0 wraps long URLs to the width of the block (set with either width or max-width).
Is your issue with FF2? You should provide a small sample of code (or an URL) showing the issue.