Handling Overflow In Tables

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

Solution 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>