wrapping and tables

[Ross]

I have a table which I put php data from a database.

If i have a name 'thisisaveryverylongfirstname' the table stetches to fit
the name. Is there any way I can force it to wrap to a fixed width of
100px??


R.

 

[Ciupri]

Suggestion: trim the name to a certain number of characters, enough to
keep it from ruining your layout, and put that in a <div> where on
mouseover you display the full name, like a hint.

Ex: name is "anextremelyandveeeeeryverylongfirstname"
trim it to "anextremely.." and display it like this:

<td>
<div
title='anextremelyandveeeeeryverylongfirstname'>anextremely..</div>
</td>

The only problem is that maybe you want the whole name displayed all at
once, but if you don't, you could use my hint.

Regards.

 

[Safalra]

I have a table which I put php data from a database.

If i have a name 'thisisaveryverylongfirstname' the table stetches to fit
the name. Is there any way I can force it to wrap to a fixed width of
100px??

I presume you've tried style="width:100px;" on the table cell and found
this doesn't work. Different browsers respond differently when a word
is longer than the specified width of an element, unfortunately. The
best option is probably for your PHP to automatically hyphenate long
names (for which you'll need some heuristic to place hyphens sensibly)
and then add a line break after the hyphen. Then your PHP could output
something like 'thisisaveryverylong-<br>firstname'. Not brilliant, but
unfortunately we're stuck with browsers with poor layout-engines.

 

[Safalra]

I have a table which I put php data from a database.

If i have a name 'thisisaveryverylongfirstname' the table stetches to fit
the name. Is there any way I can force it to wrap to a fixed width of
100px??

I presume you've tried style="width:100px;" on the table cell and found
this doesn't work. Different browsers respond differently when a word
is longer than the specified width of an element, unfortunately. The
best option is probably for your PHP to automatically hyphenate long
names (for which you'll need some heuristic to place hyphens sensibly)
and then add a line break after the hyphen. Then your PHP could output
something like 'thisisaveryverylong-<br>firstname'. Not brilliant, but
unfortunately we're stuck with browsers with poor layout-engines.

 

[Jukka K. Korpela]

If i have a name 'thisisaveryverylongfirstname' the table stetches to
fit the name. Is there any way I can force it to wrap to a fixed width
of 100px??

Wrong question. (And the answer is "No". How do you force wrapping on
Braille?)

The right question is: How do I live with the fact that I cannot control
layout in a pixel-exact manner, and should not even try?

The answer naturally depends on what you are actually doing (and we cannot
get any idea of it, in the absence of URL), but normally you should avoid
creating the problem. That is, don't generate excessively long strings.

 

[Safalra]

If i have a name 'thisisaveryverylongfirstname' the table stetches to
fit the name. Is there any way I can force it to wrap to a fixed width
of 100px??

[snip]
The right question is: How do I live with the fact that I cannot control
layout in a pixel-exact manner, and should not even try?

Surely the right question would be 'How do I persuade browser
programmers to implement sensible wrapping algorithms?'? I would *hope*
that his stated width was 100px because he fails to understand relative
units, rather than having a layout dependent on the cell being exactly
100px wide. I took his question to mean that he was annoyed by that
fact that a long word in a table cell causes it to take up a great
width, when he would prefer that column to be narrower (and here we
have the problem of browsers also having poor table-layout algorithms).
Of course I could be totally wrong; I hope he will clarify the exact
problem.

The answer naturally depends on what you are actually doing (and we cannot
get any idea of it, in the absence of URL), but normally you should avoid
creating the problem. That is, don't generate excessively long strings.

It can hardly be his fault if someone has a very long given name...

 

[Neredbojias]

With neither quill nor qualm, Safalra quothed:

If i have a name 'thisisaveryverylongfirstname' the table stetches to
fit the name. Is there any way I can force it to wrap to a fixed width
of 100px??

[snip]
The right question is: How do I live with the fact that I cannot control
layout in a pixel-exact manner, and should not even try?

Surely the right question would be 'How do I persuade browser
programmers to implement sensible wrapping algorithms?'? I would *hope*
that his stated width was 100px because he fails to understand relative
units, rather than having a layout dependent on the cell being exactly
100px wide. I took his question to mean that he was annoyed by that
fact that a long word in a table cell causes it to take up a great
width, when he would prefer that column to be narrower (and here we
have the problem of browsers also having poor table-layout algorithms).
Of course I could be totally wrong; I hope he will clarify the exact
problem.

The answer naturally depends on what you are actually doing (and we cannot
get any idea of it, in the absence of URL), but normally you should avoid
creating the problem. That is, don't generate excessively long strings.

It can hardly be his fault if someone has a very long given name...

Of course. My real name is
Neredbojiasiamsogreaticanhardlystanditandtheworldshouldbowatmyfeetwhenev
erigivethecommandtodoso but I had to shorten it in the interests of
expediency.

 

[Jukka K. Korpela]

Surely the right question would be 'How do I persuade browser
programmers to implement sensible wrapping algorithms?'?

Nope. Correct wrapping is grossly more complex than browsers could
conceivably implement, especially since HTML specifications are silent
about the matter. We've seen enough of the wrong wrapping behavior that
tries to apply Unicode line breaking rules blindly (breaking e.g.
"-a" into "-" and "a" on separate lines).

Sensible wrapping would require recognizing the language and using
language-dependent hyphenation, to start with.

I took his question to mean that he was annoyed by that
fact that a long word in a table cell causes it to take up a great
width, when he would prefer that column to be narrower

So did I. Setting the width in pixels was an additional ingredient.

(and here we
have the problem of browsers also having poor table-layout algorithms).

Browsers are _supposed_ to treat width settings as suggested minimum
widths.

It can hardly be his fault if someone has a very long given name...

It is. It is his or her responsibility to check data that goes to the page,
and handle problems suitably.

 

[Safalra]

Nope. Correct wrapping is grossly more complex than browsers could
conceivably implement, especially since HTML specifications are silent
about the matter. We've seen enough of the wrong wrapping behavior that
tries to apply Unicode line breaking rules blindly (breaking e.g.
"-a" into "-" and "a" on separate lines).

Perhaps the question should be: How do I persuade the W3C to write a
specification for a mark-up language with a good range of semantic
mark-up [so something can be marked-up as maths for instance] and then
persuade the browser programmers to implement this new, better mark-up
language, and then persuade web authors to use it? Okay, so there's no
realistic chance of that happening, but we can dream...

Sensible wrapping would require recognizing the language and using
language-dependent hyphenation, to start with.

What we need are freely-available hyphenation dictionaries for a
variety of languages released under a licence with liberal terms
(something like the GNU FDL or Creative Commons). That's certainly more
plausible than my previous paragraph.

Browsers are _supposed_ to treat width settings as suggested minimum
widths.

Right you are, of course. I'm still dissatisfied with table layout
algorithms however.

It is. It is his or her responsibility to check data that goes to the page,
and handle problems suitably.

I'll concede that point as well. Could you suggest a good way to handle
this? I'm sure there are usability issues with a previous poster's
suggestion of displaying the first few characters of a name and putting
the rest in the 'title' attribute of a surrounding <div>. (And an
unfortunately-truncated version of someone's name could offend.)

If there's no satisfactory solution for the output, the only other
solution I can see is to limit the input, but an error message saying
'Your name is too long. Please enter a shortened form.' or similar may
also offend users. (I remember a few years ago various websites
refusing to let me set up an account because my e-mail address at the
time was too long, which was infuriating.)

 

[Jukka K. Korpela]

What we need are freely-available hyphenation dictionaries

There are such dictionaries, though they are probably unreliable.
What's more important is that hyphenation dictionaries handle just a small
part of language-dependent hyphenation, though they might look like
complete solutions if you only think about the small minority of world's
language that has as little word declination as English and you don't care
about the hyphenation of uncommon words ("uncommon" defined by what is not
in some dictionary).

I'll concede that point as well. Could you suggest a good way to handle
this?

It depends on the purpose of presenting the name and on the way of getting
it. All the approaches you mention, and a few others, _may_ be suitable,
but the choice needs to depend on the circumstances. As a rule, when
presenting a person's name, the constructive approach is to avoid doing
things that confuse the presentation when the name is long. For example,
don't set a column width but let a column of names in table take its
natural width.