how to prevent unnecessary table resizing

[Dominik Jain]

Hi!

Browsers resize a table to fit the content - that's generally a good idea.
However, when the text in one cell is so long that it is wrapped, sometimes,
the table does not need to be resized as much as it generally is.
Consider the following example:

<div style="width:100px; font-size:10px;
font-family:Arial,Verdana,sans-serif">
<table border="1" cellspacing="0" cellpadding="0">
<tr><td>some<br>long text</td><td>bar</td></tr>
</table>
<br>
<table border="1" cellspacing="0" cellpadding="0">
<tr><td>some long text</td><td>bar</td></tr>
</table>
</div>

In all the browsers I've tested, the first table was clearly less wide
because the line break is a hard one rather than a soft one.
I wonder, is there a way to modify this behaviour in order to make the
second table appear in the same way as the first one?

cheers!

 

[Neredbojias]

With neither quill nor qualm, Dominik Jain quothed:

Hi!

Browsers resize a table to fit the content - that's generally a good idea.
However, when the text in one cell is so long that it is wrapped, sometimes,
the table does not need to be resized as much as it generally is.
Consider the following example:

<div style="width:100px; font-size:10px;
font-family:Arial,Verdana,sans-serif">
<table border="1" cellspacing="0" cellpadding="0">
<tr><td>some<br>long text</td><td>bar</td></tr>
</table>
<br>
<table border="1" cellspacing="0" cellpadding="0">
<tr><td>some long text</td><td>bar</td></tr>
</table>
</div>

In all the browsers I've tested, the first table was clearly less wide
because the line break is a hard one rather than a soft one.
I wonder, is there a way to modify this behaviour in order to make the
second table appear in the same way as the first one?

Use one table.

cheers!

I hope you're not Australian.

 

[dorayme]

Hi!

Browsers resize a table to fit the content - that's generally a good idea.
However, when the text in one cell is so long that it is wrapped, sometimes,
the table does not need to be resized as much as it generally is.
Consider the following example:

<div style="width:100px; font-size:10px;
font-family:Arial,Verdana,sans-serif">
<table border="1" cellspacing="0" cellpadding="0">
<tr><td>some<br>long text</td><td>bar</td></tr>
</table>
<br>
<table border="1" cellspacing="0" cellpadding="0">
<tr><td>some long text</td><td>bar</td></tr>
</table>
</div>

In all the browsers I've tested, the first table was clearly less wide
because the line break is a hard one rather than a soft one.
I wonder, is there a way to modify this behaviour in order to make the
second table appear in the same way as the first one?

In the 2nd table, use <br> after the word "Some" and it will behave just
like the first table.

dorayme

 

[Dominik Jain]

In the 2nd table, use <br> after the word "Some" and it will behave
just like the first table.

While that is an obvious solution, I cannot do that, because the data in the
table comes from a database, and I do not know where the browser is going to
insert the soft line break.

The question is: Can I do something to make a soft line break inserted by
the browser have the same effect as a hard line break.

bye,

 

[Dominik Jain]

Use one table.

That will have the opposite effect - the first table will become wider... I
want the tables to be as narrow as possible. So if a soft line break is
inserted, the table could actually be narrower. The browsers' logic is: the
longer the line, the wider the column should be.

bye!

 

[Dominik Jain]

<div style="width:100px; font-size:10px;
font-family:Arial,Verdana,sans-serif">
<table border="1" cellspacing="0" cellpadding="0">
<tr><td>some<br>long text</td><td>bar</td></tr>
</table>
<br>
<table border="1" cellspacing="0" cellpadding="0">
<tr><td>some long text</td><td>bar</td></tr>
</table>
</div>

To clarify:
Since the containing div has width 100, the first column will have a line
break after the word "some" in both cases. The widths of the tables differ
greatly, however, because in the second table the browsers use the length of
the entire sentence as a basis for resizing the column. The soft line breaks
they insert are not taken into consideration.

Is there a way to get around that?

On the real page, I have 3 columns and 1 row per table. All the coluimns may
contain one or two lines after the insertion of soft line breaks. I would
like to have the automatic sizing of column according that happens in
tables, but I would like to avoid columns getting broader when soft line
breaks would allow a shorter width, in order to minimize the spacing between
columns.

bye,

 

[Neredbojias]

With neither quill nor qualm, Dominik Jain quothed:

To clarify:
Since the containing div has width 100, the first column will have a line
break after the word "some" in both cases.

Why would it in the second case?

The widths of the tables differ
greatly, however, because in the second table the browsers use the length of
the entire sentence as a basis for resizing the column. The soft line breaks
they insert are not taken into consideration.

What do you want it to do, break after the first soft line break? Is
the cell width fixed?

Is there a way to get around that?

On the real page, I have 3 columns and 1 row per table. All the coluimns may
contain one or two lines after the insertion of soft line breaks. I would
like to have the automatic sizing of column according that happens in
tables, but I would like to avoid columns getting broader when soft line
breaks would allow a shorter width, in order to minimize the spacing between
columns.

I think you're viewing this a trifle askew, matey.

 

[Dominik Jain]

Why would it in the second case?

Because 100 pixels aren't enough to fit the words "some long text" in a
single line using the given font size.

I've put the code online, so you can see what I mean:
http://cvsnix.lrt.mw.tu-muenchen.de/~jain/test.htm

What do you want it to do, break after the first soft line break? Is
the cell width fixed?

Of course not. I want cell width to be automatic.
What I want to avoid is the unnecessary spacing that results from the
insertion of soft line breaks. (see second table)

bye,

 

[Neredbojias]

With neither quill nor qualm, Dominik Jain quothed:

Of course not. I want cell width to be automatic.
What I want to avoid is the unnecessary spacing that results from the
insertion of soft line breaks. (see second table)

Well, if I got this correctly now, the best way I can think of is to use
a regular expression to convert the soft l-bs in the second-table text
to spaces. This can be done with javascript or server-side scripting
like PHP.

A javascript example of converting all whitespace to spaces is:

var stt="second table text";
stt=stt.replace(/\W/," ");

 

[Dominik Jain]

Well, if I got this correctly now, the best way I can think of is to
use a regular expression to convert the soft l-bs in the second-table
text to spaces. This can be done with javascript or server-side
scripting like PHP.

A javascript example of converting all whitespace to spaces is:

var stt="second table text";
stt=stt.replace(/\W/," ");

The whitespice in the example is already spaces only.
Why would that help?

If anything, I should be replacing certain spaces with <br>s...

bye,