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:

Are there any other options apart from hidden for handling overflow in tables?
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)

rahul · Accepted Answer · 2009-09-24 11:59:03Z

5

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>

answered Sep 24, 2009 at 11:59

rahul

188k50 gold badges239 silver badges266 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Dorjan Over a year ago

I've tried but to no avail, it just plows on by and spills out into the page!

Dorjan Over a year ago

Ooh i didn't see you saying about putting the image inside a div... will try that now

Collectives™ on Stack Overflow

Handling overflow in tables

1 Answer 1

2 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related