Fixed column widths in tables

[jaeney]

Hi,

I have a table which contains very long strings of characters which are larger than the table cell width that I have specified. Because of this the table is approx. twice the size of the screen, which means that the user must scroll horizontally to view the entire contents. My question is how can I specify that the table widths should be fixed regardless of the size of the largest word in the text.

I've tried using:
<style type="text/css">
table {table-layout: fixed;}
</style>

Combined with the COL table tags:
<table width="770" cellpadding="1" cellspacing="0" border="1">
<col width="50">
<col width="150">
...
</table>

This seemed to work ok, however, the text is not wrapping in the cells. That is, the words which are too long to be displayed in the cell are being cut off. So, I would like to know how to emulate some type of line break in the middle of a word if the word is longer than the cell width.

Any help would be greatly appreciated.
Thanks

[creole]

The short answer is that you can't.

Browsers interpret things in levels of specificity, which is a fancy way of saying that some things are more important than others. The single most important thing on a website is it's content (either text or images). If a string of unbroken text or an image is wider than the setting for it's container (TABLE, DIV, P, etc) then it is the container which will change, not the item inside it.

That's just the way it goes and you can't change it. You might ask yourself though, why you would want such a long unbroken string of text on your page. Even if it wasn't inside a TABLE, it would cause horizontal scrollbars.

As for the linebreak, why not just PUT a linebreak in the string?

[jaeney]

That's too bad

The reason for having such large strings was that the content of the table was holding web server log information such as the referring URL, the request string, the user-agent and these can get quite long. So, the cell widths auto-fit to the largest of all the cell values which makes it quite difficult to read. I've used different colors for each alternating row to make it easier to see the data however the entire table in one screen would have been mroe efficient to read.

Thanks for your reply.

[jaeney]

Just when I thought that my persistent searching was proving to be a fruitless endeavor I've come across a CSS reference sheet in MSDN:
http://msdn.microsoft.com/library/de...attributes.asp

Their were two attributes that I looked at:

word-wrap: normal | break-word;
- Sets or retrieves whether to break words when the content exceeds the boundaries of its container (IE 5+).
- break-word property: Content wraps to next line, and a word-break occurs when necessary.

But this one didn't seem to work, which I can't seem to understand why and the word-break attribute:

word-break: normal | break-all | keep-all;
- Sets or retrieves line-breaking behavior within words, particularly where multiple languages appear in the object (IE 5.5+).

Which seemed to work. They may be Microsoft specific but that is fine.

[creole]

Great...good attitude about it too. Keep looking until you get the answer you want.