Scrollable Divs in IE8

I have a page which contains a number of different areas to enter data. In order to keep the dimensions the same no matter what is entered, I wanted to try using a scrollable div. However, I’m having some difficulty with it in IE8. If I have a large enough amount of data where I should be getting scrollbars, IE8, instead, just keeps everything displayed. And if the data doesn’t actually fill the entire height, the div is shortened to the height of the data.

Here is the code I’m using for the div section:

[code=html]
<div style=”width:280;height:200;border:1px solid;overflow:auto;”>
<table id=”tblCN”>
<input type=”hidden” name=”cblID” id=”cblID” value=”<%=cblID%>” />
<input type=”hidden” name=”impact” id=”impact” value=”” />
<tr>
<td>CN Number</td>
<td colspan=”3″>Impact/Description</td>
</tr>
<tr>
<td><select name=”cnNum” id=”cnNum” class=”dd”><option value=””>&nbsp</option>
<% do while not rsCNNum.EOF%><option value=”<%=rsCNNum(“CN_id”)%>”><%=rsCNNum(“cnNumber”) %></option>
<% rsCNNum.moveNext
Loop%>
</select></td>
<td><div style=”border:1px solid #7F9DB9; width:35px;”><div id=”expDDmsg” style=”display:inline;float:left” onclick=”dispDD()”></div><img src=”down.gif” onmouseup=”this.src=’down.gif'” onmousedown=”this.src=’downPress.gif'” onclick=”dispDD()” height=”16″ width=”15″ align=”right” />
</div>
<select id=”expDD” size=”4″ style=”display: none; position:absolute;font-size:10pt;font-family:’Times New Roman’;” onchange=”changeDrop(this.value);”>
<option value=””></option>
<option value=”A”>A | Add</option>
<option value=”M”>M | Modify</option>
<option value=”D”>D | Delete</option>
</select></td>
<td></td>
<td><input type=”text” class=”text” id=”impDesc” name=”impDesc” size=”15″ value=”” /></td>
<td><a href=”#” onclick=”addCN();return false;”>Add</a></td>
</tr>
</table>
</div>[/code]

If I add another 10 rows to this table, instead of adding the scrollbars, it displays everything.

I hope someone can help.

Chris

Also in #CSS _↴