«

I've noticed that a table cell width is ignored if the content contains
words that (themselves) are wider than the specified width. The table just
grows width-wise.

Is there any way to stop this?

I'm trying to get my tables to fit 640px wide, but the content frequently
makes them bleed off the page.

TIA,
John

"John Wood" <> wrote:

> Is there any way to stop this?

CSS might do it.

The Doormouse

--
The Doormouse cannot be reached by e-mail without her permission.

John Wood wrote:
> I've noticed that a table cell width is ignored if the content
> contains words that (themselves) are wider than the specified width.
> The table just grows width-wise.
>
> Is there any way to stop this?
>
> I'm trying to get my tables to fit 640px wide, but the content
> frequently makes them bleed off the page.

Wrap the content of those cells into a <div>, then control the <div> via CSS.

<td>
<div class="something">
stuff goes here
</div>
</td>

div.something {
width: 200px;
height: 300px;
overflow: auto;
}

Tables are wonderfully flexible, adapting to the user's environment such as
text size & viewport width. This is fully within the spirit of the web, with
fluid design conforming to the needs and preferences of the users.

But sometimes this is a problem for authors. So don't try to control the
tables directly. You can't. Control their content instead. Then the table will
adapt to the controlled content. If you wrap the content in a <div>, and
control the <div>, the table will adapt, and the <div> will shield the table
from its contents.

In the above CSS, the { overflow: auto } will give scrollbars *if needed*.
Alternatively, you could use { overflow: hidden } and hide the extra stuff.

--
Barry Pearson
http://www.Barry.Pearson.name/photography/
http://www.BirdsAndAnimals.info/
http://www.ChildSupportAnalysis.co.uk/

Barry Pearson wrote:

> John Wood wrote:
>> I've noticed that a table cell width is ignored if the content
>> contains words that (themselves) are wider than the specified width.
>> The table just grows width-wise.
>>
>> Is there any way to stop this?
>>
>> I'm trying to get my tables to fit 640px wide, but the content
>> frequently makes them bleed off the page.

Why not reduce the content then?

> Wrap the content of those cells into a <div>, then control the <div> via
> CSS.
>
> <td>
> <div class="something">
> stuff goes here
> </div>
> </td>
>
> div.something {
> width: 200px;
> height: 300px;
> overflow: auto;
> }

Why not apply the CSS directly to the table data cell?


--
David Dorward <http://blog.dorward.me.uk/> <http://dorward.me.uk/>

David Dorward wrote:
> Barry Pearson wrote:
>> John Wood wrote:
>>> I've noticed that a table cell width is ignored if the content
>>> contains words that (themselves) are wider than the specified width.
>>> The table just grows width-wise.
>>>
>>> Is there any way to stop this?
>>>
>>> I'm trying to get my tables to fit 640px wide, but the content
>>> frequently makes them bleed off the page.
>
> Why not reduce the content then?

The size of the content is often not under the control of the author. Tables
are wonderfully flexible, adapting to the user's environment such as text size
& viewport width. This is fully within the spirit of the web, with fluid
design conforming to the needs and preferences of the users.

But the layout concept may want control of the width and/or height. At least
for some cells.

>> Wrap the content of those cells into a <div>, then control the <div>
>> via CSS.
>>
>> <td>
>> <div class="something">
>> stuff goes here
>> </div>
>> </td>
>>
>> div.something {
>> width: 200px;
>> height: 300px;
>> overflow: auto;
>> }
>
> Why not apply the CSS directly to the table data cell?

See above. It doesn't work. Tables typically override CSS controls. Tables
adapt to their content. So control their content instead.

Experiment. Compare controlling table cells with controlling the contents of
tables cells. The difference is amazing.

--
Barry Pearson
http://www.Barry.Pearson.name/photography/
http://www.BirdsAndAnimals.info/
http://www.ChildSupportAnalysis.co.uk/

Actually controlling the content in this case is difficult. The table has
alternating spanning column rows containing a lot of text. If any of the
words are unable to wrap correctly, the table resizes... I could look
through all the text and put a maximum width on each word, but the overhead
of doing that may be too large. I'd rather put the processing overhead on
the client.

The div solution does work, but does slow down with larger tables... and I
have yet to see how it works in browsers such as Safari.

Thanks all for your suggestions!

"Barry Pearson" <> wrote in message
news:qbDfc.26$mQ3.11@newsfe1-win...
> David Dorward wrote:
> > Barry Pearson wrote:
> >> John Wood wrote:
> >>> I've noticed that a table cell width is ignored if the content
> >>> contains words that (themselves) are wider than the specified width.
> >>> The table just grows width-wise.
> >>>
> >>> Is there any way to stop this?
> >>>
> >>> I'm trying to get my tables to fit 640px wide, but the content
> >>> frequently makes them bleed off the page.
> >
> > Why not reduce the content then?
>
> The size of the content is often not under the control of the author.
Tables
> are wonderfully flexible, adapting to the user's environment such as text
size
> & viewport width. This is fully within the spirit of the web, with fluid
> design conforming to the needs and preferences of the users.
>
> But the layout concept may want control of the width and/or height. At
least
> for some cells.
>
> >> Wrap the content of those cells into a <div>, then control the <div>
> >> via CSS.
> >>
> >> <td>
> >> <div class="something">
> >> stuff goes here
> >> </div>
> >> </td>
> >>
> >> div.something {
> >> width: 200px;
> >> height: 300px;
> >> overflow: auto;
> >> }
> >
> > Why not apply the CSS directly to the table data cell?
>
> See above. It doesn't work. Tables typically override CSS controls. Tables
> adapt to their content. So control their content instead.
>
> Experiment. Compare controlling table cells with controlling the contents
of
> tables cells. The difference is amazing.
>
> --
> Barry Pearson
> http://www.Barry.Pearson.name/photography/
> http://www.BirdsAndAnimals.info/
> http://www.ChildSupportAnalysis.co.uk/
>
>

On Thu, 15 Apr 2004 18:07:35 GMT, "John Wood" <>
declared in alt.html:

> I'm trying to get my tables to fit 640px wide, but the content frequently
> makes them bleed off the page.

"Doctor, it hurts when I do this."
"Stop doing that."

http://www.allmyfaqs.com/faq.pl?AnySizeDesign
http://www.allmyfaqs.com/faq.pl?Tableless_layouts

--
Mark Parnell
http://www.clarkecomputers.com.au