Enforcing table cell width

[laredotornado]

Hi,

What is a cross-browser way to enforce that a table cell adhere to a
specified width even if there's a word in there that exceeds that
width? Right now, the longer word is taking precedence over the table
width on both FF and IE.

Thanks, - Dave

 

[Els]

What is a cross-browser way to enforce that a table cell adhere to a
specified width even if there's a word in there that exceeds that
width? Right now, the longer word is taking precedence over the table
width on both FF and IE.

I think the only way is to set the table cell to overflow:hidden or
overflow:scroll. Not tested.

 

[Jemdam.com]

I think the only way is to set the table cell to overflow:hidden or
overflow:scroll. Not tested.

CSS is the only way to do this, there is no HTML table option for this. I
use tables far to much but I do think they are easy and quick to set up.

Cheers D http://www.binaryincome.com

 

[laredotornado]

CSS is the only way to do this, there is no HTML table option for this. I
use tables far to much but I do think they are easy and quick to set up.

Cheers Dhttp://www.binaryincome.com

And what is the CSS way to do it? - Dave

 

[Jukka K. Korpela]

Scripsit (e-mail address removed):

What is a cross-browser way to enforce that a table cell adhere to a
specified width

None. How wide is a table in speech rendering?

But if you are referring to reasonably new graphic browsers, then the answer
is, with the usual CSS Caveats, that you can "enforce" a width for a cell by
using table-layout: fixed for the table and by setting a width for the
entire table. (On IE, things work even if you don't set the table width; IE
defaults it to 100%.)

even if there's a word in there that exceeds that
width?

And what do you want to happen to the poor word? By default, the word
overflows to the neighbor cell, though IE uses the default of overflow:
hidden, i.e. brutally truncates the word. Both ways are rather problematic.

The answer to your _real_ question is _probably_ "Yes, people _can_ pollute
your guestbook with all kinds of stuff unless you take precautions. You
should preprocess the data so that the problem does not arise, e.g. by
truncating too long words before they get written onto a web page."

 

[Jim Moe]

What is a cross-browser way to enforce that a table cell adhere to a
specified width even if there's a word in there that exceeds that
width? Right now, the longer word is taking precedence over the table
width on both FF and IE.

Use a <div> inside the table cell. Set the div's width to the desired size.

 

[Jim Moe]

What is a cross-browser way to enforce that a table cell adhere to a
specified width even if there's a word in there that exceeds that
width? Right now, the longer word is taking precedence over the table
width on both FF and IE.

Hmm. On further consideration... What is the application (URL)? Maybe a
table is an inappropriate choice.

 

[laredotornado]

Scripsit (e-mail address removed):


None. How wide is a table in speech rendering?

But if you are referring to reasonably new graphic browsers, then the answer
is, with the usual CSS Caveats, that you can "enforce" a width for a cell by
using table-layout: fixed for the table and by setting a width for the
entire table. (On IE, things work even if you don't set the table width; IE
defaults it to 100%.)


And what do you want to happen to the poor word? By default, the word
overflows to the neighbor cell, though IE uses the default of overflow:
hidden, i.e. brutally truncates the word. Both ways are rather problematic.

The answer to your _real_ question is _probably_ "Yes, people _can_ pollute
your guestbook with all kinds of stuff unless you take precautions. You
should preprocess the data so that the problem does not arise, e.g. by
truncating too long words before they get written onto a web page."

I want the word to be broken in mid-stream so that part appears on one
line and the rest appears on the next. I've tried setting a fixed
width for the entire table but the word (which is really a long email
address) is still breaking the table.

Thanks, - Dave

 

[dorayme]

I've tried setting a fixed
width for the entire table but the word (which is really a long email
address) is still breaking the table.

Before trying to accommodate a really long address in this
fashion, think of not putting in the address at all, just the
mailto: code with a descriptive short text to appear, like "Tex
Ritter's email" (which by the way will wrap fine naturally).

 

[Ben C]

I want the word to be broken in mid-stream so that part appears on one
line and the rest appears on the next.

Not possible in CSS 2.1. Lines will only ever be broken in the proper
places. You can insert zero-width breaking spaces between each letter if
you really want to.

 

[Jukka K. Korpela]

Scripsit Jim Moe:

Use a <div> inside the table cell. Set the div's width to the
desired size.

On IE, that won't help unless you also set overflow (for the div) to a value
other than the default (visible).

 

[Jukka K. Korpela]

Scripsit dorayme:

Before trying to accommodate a really long address in this
fashion, think of not putting in the address at all, just the
mailto: code with a descriptive short text to appear, like "Tex
Ritter's email" (which by the way will wrap fine naturally).

Bad idea. You would make it more difficult to people write down the address,
for example. What if you had printed a page containing contact information
and needed to check the address from it, in some situation, just to find out
that the print says "Tex Ritter's email".

Now that we are perhaps a little closer to the original problem, several
solutions suggest themselves:
a) stop using rigid layout
b) stop squeezing content into tiny areas and wasting space for navigation,
advertisement and "esthetic" margins
c) don't put an email address inside text but in a separate box containing
contact info
d) make the address shorter - if someone else is fool enough to have
acquired a really long email address, why would you advertize it?

Of course, it _is_ possible to make a long email address break into several
lines. That was not at all what was originally asked, and it's a problem you
shouldn't create for yourself, so let's keep _that_ solution secret, at
least until we have a good explanation with a working URL.

 

[dorayme]

Before trying to accommodate a really long address in this
fashion, think of not putting in the address at all, just the
mailto: code with a descriptive short text to appear, like "Tex
Ritter's email" (which by the way will wrap fine naturally).

Bad idea. You would make it more difficult to people write down the address,
for example.[/QUOTE]

If it was a bad idea to think about this alternative and
implement it in various contexts, then presumably one should
never so do. Since this is appropriate in some contexts, it
cannot be such a bad idea to think about it.

It does not preclude having the full address elsewhere on the
page (outside an overcrowded table) or in a print out. All
depends on the design.

Perhaps you are privy to information about the OP that I am not
privy to? I know he said: "I've tried setting a fixed
width for the entire table but the word (which is really a long
email address) is still breaking the table."

One technique I used once to limit the width of a column of web
addresses in a multi col spreadsheet was to head the col with
"http://www" or just "http://" to offload the text that was to be
common to all the addresses. More difficult to adapt for email
addresses for obvious reasons.

I agree with every one of your other suggestions.

 

[Jim Moe]

On IE, that won't help unless you also set overflow (for the div) to a value
other than the default (visible).

Crap! That's right. Thanks for reminding me.