Question

I am having a html table inside a div element.

div is set to auto scroll on overflow

div.container {overflow-x: scroll; overflow-y: hidden;}

what i want to achieve is – table cells be auto adjustable, but if the minimum width of any cell is crossed(say more columns are added automatically), view should be set to auto scroll.

<table cellspacing=0px id="tbl_iss" class="issues" style="table-layout: fixed" width="100%">
<thead>
<tr bgcolor="#D0D0D0" >
   <th width=50px style="min-width: 50px; _width: 50px;">Issue#</th>
   <th width=100px style="min-width: 100px; _width: 100px;">Abc</th>
   <th width=100px style="min-width: 100px; _width: 100px;">xyz</th>
   <th width=120px style="min-width: 100px; _width: 120px;">Pqr</th>
   <th width=200px style="min-width: 200px; _width: 200px;">Stu</th>
   <th width=120px style="min-width: 120px; _width: 120px;">efg</th>
</tr>
</thead>
</table>

comments plz?

Answer 1

Tables and especially table cells do not behave as one would wish regarding width and height

If you wrap the content of your table cells in a div? and give thisdiv` the width, you could be more lucky

<th><div style="min-width: 50px; _width: 50px;">Issue#</div></th>