Table squash - Window resize

[burt46]

Hi,

I have a table that displays three pictures each in seperate cells in a single row. The table is set to resize by percentage as the browser window resizes. Problem is that when the window is small and the table is at is minimum width (set by the natural width of the pictures) the table pushes out the side of the window. Basically is there a way of setting a table to squash or collpase to entirely display if a window is minimised to a width narrower than the table?
Cheers

[sypher]

Hmm i dont quite understand the question, the minimum size of the table will be the width of the images.

[herkalees]

Actually, no. All table data cells (<td></td>) contained within a table row (<tr></tr>) will always stay on one row without breaking onto a new line when the content contained within them are wider than the browser window. A horizontal scroll bar will appear.

The only way I can think of to achieve what you're asking for is losing the table and using some simple css, like this:

HTML: <img src="picture1.jpg" alt="my dog" class="floatedimage" /> <img src="picture2.jpg" alt="my cat" class="floatedimage" /> <img src="picture3.jpg" alt="my mom" class="floatedimage" />

CSS: .floatedimage {float:left; margin-right:15px;}

Then, whatever element is below these pictures in the html get's a particular style, like this:

<p style="clear:left;">This is some content below the images.</p>

[burt46]

I see. Thanks for that. I'll look into it. I always thought there was a way of stacking cells if the window size was smaller than the table.

Cheers

[sypher]

Whats the url? Hopefully i will understand with some visuals