I have a table with many rows on my page. I would like to set table's height, say for 500px, such that if the height of the table is bigger than that, a vertical scroll bar will appear. I tried to use CSS height
attribute on the table
, but it doesn't work.
Css – How to specify table’s height such that a vertical scroll bar appears
csscss-tables
Best Answer
Try using the
overflow
CSS property. There are also separate properties to define the behaviour of just horizontal overflow (overflow-x
) and vertical overflow (overflow-y
).Since you only want the vertical scroll, try this:
EDIT:
Apparently
<table>
elements don't respect theoverflow
property. This appears to be because<table>
elements are not rendered asdisplay: block
by default (they actually have their own display type). You can force theoverflow
property to work by setting the<table>
element to be a block type:Note that this will cause the element to have 100% width, so if you don't want it to take up the entire horizontal width of the page, you need to specify an explicit width for the element as well.