I’ve got a table on a webpage, with (say) 8 columns, and it’s worked just fine until recently…
A user registered with an email address for a display name (not a huge issue, but the email is massive). Now, as one of the columns is a ‘reported by’ containing username, any pages with said user on them now have a massive ‘reported by’ column…
I should also emphasise, the table width was 100% (minus a ‘margin’) prior to this issue, and it worked just fine).
Is there a clever way to introduce a line break on a ‘.’ or an ‘@’? Alternatively, how do people normally get around this? Interesting solutions to this annoying problem are welcomed!
When you generate your html table content code, truncate every content extracted from your database to a maximum width. Your truncating function can easily add a tooltip giving the full label.
Alternatively, do this in javascript on pageload. Parse every table cell and truncate the content if it’s too large. It’s not as nice as server-side truncating, though.
The upside is that you can give the full label in a tooltip, append ‘…’ to let the user know the label is truncated, etc.