Handling overflow in tables

Question

If I have a table like this very very simple example:

table {
    table-layout:fixed;
    width:300px;
}

.td1 {
    width:100px;
}
.td2 {
    width:200px;
}

and in one of my .td2 contains an image that is, lets say, 300px in width. I would like to show scroll bars to allow users to scroll to see it all. However I don't think this is possible, is it?

So my questions are:

1. Are there any other options apart from hidden for handling overflow in tables?

2. Is it possible to show scroll-bars only when content pushes beyond a set width? (I swear I've seen it in some forum software but I can't remember which one)

Answer 1

What about

overflow: auto

Content is clipped and scrolling is added only when necessary.

Put the image inside a div in the table cell and make the width and height of the div to be 100% of the td and style it to overflow: auto

<style>
.test { width: 100%; height: 100%; overflow: auto; } 
</style>

<td>
<div class="test">
your image
</div>
</td>