Getting vertical scroll bar in a table cell


T

Tim Streater

It would seem that, if I have content in a table cell that is too tall
for the cell, the only way I can get a vertical scroll bar in the cell
is to put a <div> in the cell, and put the content in that.

It also looks like I then have to explicitly set the height of the
<div> to any old value, whereupon the scroll bar appears, is the height
of the cell, and correctly scrolls the content.

Is there some logic to this, and if so what is it?
 
Ad

Advertisements

R

richard

It would seem that, if I have content in a table cell that is too tall
for the cell, the only way I can get a vertical scroll bar in the cell
is to put a <div> in the cell, and put the content in that.

It also looks like I then have to explicitly set the height of the
<div> to any old value, whereupon the scroll bar appears, is the height
of the cell, and correctly scrolls the content.

Is there some logic to this, and if so what is it?

because table cells natively expand with content size and so do all of the
cells within that row.
In order to maintain the cell size as you want it, you must therefor use a
division so you can get the scrollbar.
 
Ad

Advertisements

D

dorayme

Tim Streater said:
It would seem that, if I have content in a table cell that is too tall
for the cell, the only way I can get a vertical scroll bar in the cell
is to put a <div> in the cell, and put the content in that.

If the content is "too tall" for the cell then you already must have a
height restriction on the table or the row or the cell, because table
cells normally shrink or expand to fit. And for obvious reasons, the
cells in any one row are the same height. If you put a height
restriction on the cell, the content will simply overflow. Styling a
cell directly with an overflow: auto or scroll (in addition to the
height - without a height the *table* just gains height to
accommodate) does not work. It is a good question as to why it could
not have been otherwise - that is, just height and overflow: auto or
scroll on the cell directly.

One normally works this with an inner DIV (as you are doing) and
styling this.

It also looks like I then have to explicitly set the height of the
<div> to any old value, whereupon the scroll bar appears, is the height
of the cell, and correctly scrolls the content.

Why to any old value? What is the context? What is causing the height
restriction, you talking viewport height of a user? If so, the
scrollbars should appear fine on the table itself.
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Top